Android：繪製一個畫布而不會遮住一排按鈕

Question

我的問題可能很簡單 - 有很多應用程序可以完成我所要做的事情。

我有一排按鈕的相對佈局，然後在這之下我想畫在畫布上。

我的問題是，畫布繪製按鈕或代替按鈕，所以我最終是一個形狀。

這是我的代碼：

    package com.android.phil.graphtoggle; 

    import android.app.Activity; 
    import android.content.Context; 
    import android.graphics.Canvas; 
    import android.graphics.drawable.ShapeDrawable; 
    import android.graphics.drawable.shapes.OvalShape; 
    import android.os.Bundle; 
    import android.view.View; 
    import android.widget.ImageButton; 

    public class MainActivity extends Activity 
    { 
     public int graph_toggle = 0; 
     public int data_toggle=0; 
     /** Called when the activity is first created. */ 
     @Override 
     public void onCreate(Bundle savedInstanceState) 
     { 
      super.onCreate(savedInstanceState); 
      setContentView(R.layout.main); 
      final ImageButton graph_toggle_button = (ImageButton) findViewById(R.id.graph_toggle); 
      final ImageButton graph_settings_button = (ImageButton) findViewById(R.id.graph_type); 
      final ImageButton data_toggle_button = (ImageButton) findViewById(R.id.data_toggle); 

      CustomDrawableView mCustomDrawableView; 

      mCustomDrawableView = new CustomDrawableView(this); 
      setContentView(mCustomDrawableView); 

      graph_toggle_button.setOnClickListener(new View.OnClickListener() 
      { 
       public void onClick(View arg0) 
       { 
        if (graph_toggle==2) 
        { 
         graph_toggle=0; 
        } 
        else 
        { 
         graph_toggle++; 
        } 

        if (graph_toggle==0) 
        { 
         graph_settings_button.setImageResource(R.drawable.close); 
        } 
        if (graph_toggle==1) 
        { 
         graph_settings_button.setImageResource(R.drawable.ohlc_bars); 
        } 
        if(graph_toggle==2) 
        { 
         graph_settings_button.setImageResource(R.drawable.candles); 
        }    
       }   
      }); 
      data_toggle_button.setOnClickListener(new View.OnClickListener() 
      { 
       public void onClick(View arg0) 
       { 
        if (data_toggle==2) 
        { 
         data_toggle=0; 
        } 
        else 
        { 
         data_toggle++; 
        } 

        if (data_toggle==0) 
        { 
         data_toggle_button.setImageResource(R.drawable.ohlc_bars_daily); 
        } 
        if (data_toggle==1) 
        { 
         data_toggle_button.setImageResource(R.drawable.ohlc_bars_weekly); 
        } 
        if(data_toggle==2) 
        { 
         data_toggle_button.setImageResource(R.drawable.ohlc_bars_monthly); 
        }    
       }   
      }); 
     } 
     public class CustomDrawableView extends View 
     { 
      private ShapeDrawable mDrawable; 

      public CustomDrawableView(Context context) 
      { 
       super(context); 

       int x = 10; 
       int y = 100; 
       int width = 300; 
       int height = 50; 

       mDrawable = new ShapeDrawable(new OvalShape()); 
       mDrawable.getPaint().setColor(0xff74AC23); 
       mDrawable.setBounds(x, y, x + width, y + height); 
      } 

      protected void onDraw(Canvas canvas) 
      { 
        mDrawable.draw(canvas); 
      } 
     } 
    } 

這是我的xml：

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
android:layout_width="fill_parent" 
android:id="@+id/relativeLayout1" xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="fill_parent"> 
    <ImageButton 
    android:layout_height="40dip" 
    android:layout_width="40dip" 
    android:id="@+id/graph_toggle" 
    android:src="@drawable/graph_toggle" 
    android:layout_alignParentLeft="true" 
    ></ImageButton> 
    <ImageButton 
    android:layout_height="40dip" 
    android:layout_width="40dip" 
    android:id="@+id/graph_type" 
    android:src="@drawable/close" 
    android:layout_toRightOf="@+id/graph_toggle" 
    ></ImageButton> 
    <ImageButton 
    android:layout_height="40dip" 
    android:layout_width="40dip" 
    android:id="@+id/data_toggle" 
    android:src="@drawable/ohlc_bars_daily" 
    android:layout_toRightOf="@+id/graph_type" 
    ></ImageButton> 
    <ImageButton 
    android:layout_height="40dip" 
    android:layout_width="40dip" 
    android:id="@+id/data_toggle1" 
    android:src="@drawable/ohlc_bars_daily" 
    android:layout_toRightOf="@+id/data_toggle" 
    ></ImageButton> 
    <ImageButton 
    android:layout_height="40dip" 
    android:layout_width="40dip" 
    android:id="@+id/data_toggle2" 
    android:src="@drawable/ohlc_bars_daily" 
    android:layout_toRightOf="@+id/data_toggle1" 
    ></ImageButton> 
    <ImageButton 
    android:layout_height="40dip" 
    android:layout_width="40dip" 
    android:id="@+id/data_toggle3" 
    android:src="@drawable/ohlc_bars_daily" 
    android:layout_toRightOf="@+id/data_toggle2" 
    ></ImageButton> 
    <ImageButton 
    android:layout_height="40dip" 
    android:layout_width="40dip" 
    android:id="@+id/data_toggle4" 
    android:src="@drawable/ohlc_bars_daily" 
    android:layout_toRightOf="@+id/data_toggle3" 
    ></ImageButton> 
</RelativeLayout> 

Answer 1

你與你的自定義視圖替換你的整個XML佈局，當你撥打：

setContentView(mCustomDrawableView); 

你應該自定義視圖，而添加到佈局，是這樣的：

RelativeLayout mainLayout = (RelativeLayout)findViewById(R.id.relativeLayout1); 

RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(/*up to you*/); 
// add here other layout params rules to make your 
// custom view stay below the buttons 

mCustomDrawableView.setLayoutParams(lp); 
mainLayout.addView(mCustomDrawableView); 

但是你也應該考慮添加到您的自定義查看這種構造：

public CustomDrawableView(Context context, AttributeSet attrs) { 
    super(context, attrs); 
    // add other init stuff 
} 

，使您可以使用您的自定義視圖到XML，使其更容易指定佈局參數，可以因爲...如果在代碼中執行此操作，則可能無聊RelativeLayout。

Answer 2

創建擴展了的FrameLayout類的類和覆蓋OnDraw函數 那裏，你可以畫你想要的一切，它會表現得像其他任何視圖