2013-08-29 109 views
11

我試圖開發一個android應用程序,但我在GUI設計中遇到了一些問題。以下部分截圖是我的問題(紅色和藍色線條是由Android調試選項生成的)。在RelativeLayout中防止視圖重疊

my problem

這是代碼:

<RelativeLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_alignLeft="@+id/caption" 
    android:layout_below="@+id/caption" > 

    <ImageButton 
     android:id="@+id/button_edit" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerVertical="true" 
     android:layout_alignParentRight="true" 
     android:src="@drawable/content_edit" 
     style="?android:attr/borderlessButtonStyle" /> 

    <TextView 
     android:id="@+id/myText" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentLeft="true" 
     android:layout_centerVertical="true" 
     android:text="@string/num_placeholder" 
     android:textAppearance="?android:attr/textAppearanceLarge" /> 


</RelativeLayout> 

正如你所看到的,會將myText的TextView重疊的ImageButton button_edit。 一個簡單的解決方案是使用LinearLayout而不是RelativeLayout。問題是:

  1. 我需要正確的
  2. 我需要的文字填寫佈局的其餘部分(以明顯的編輯按鈕的左邊)

我還編輯按鈕試圖將myText的layout_width設置爲'fill_parent',但它填充了編輯按鈕左側的整個屏幕的其餘部分。

預期的行爲將MYTEXT增加其高度(成爲兩行的TextView),而不是重疊的「button_edit」

誰能幫助我?在TextView的佈局感謝

+0

爲什麼你想在'LinearLayout'中實現'RelativeLayout'? – sriramramani

回答

19

使用layout_toLeftOf

這樣的:

<RelativeLayout 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:layout_alignLeft="@+id/caption" 
android:layout_below="@+id/caption" > 

<ImageButton 
    android:id="@+id/button_edit" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerVertical="true" 
    android:layout_alignParentRight="true" 
    android:src="@drawable/content_edit" 
    style="?android:attr/borderlessButtonStyle" /> 

<TextView 
    android:id="@+id/myText" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentLeft="true" 
    android:layout_centerVertical="true" 
    android:text="@string/num_placeholder" 
    android:textAppearance="?android:attr/textAppearanceLarge" 
    android:layout_toLeftOf="@+id/button_edit" /> 

+0

謝謝!它完美的作品! – Gnufabio

+0

如果我們想用動態創建視圖實現它,該怎麼辦? –

0

做的另一種方法是使用Android:layout_toEndOf屬性

<ImageButton 
    android:id="@+id/button_edit" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerVertical="true" 
    android:layout_alignParentRight="true" 
    android:src="@drawable/content_edit" 
    style="?android:attr/borderlessButtonStyle" 
    android:layout_toEndOf="@+id/myText" /> 

<TextView 
    android:id="@+id/myText" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentLeft="true" 
    android:layout_centerVertical="true" 
    android:text="@string/num_placeholder" 
    android:textAppearance="?android:attr/textAppearanceLarge" />