1. 首頁
  2. 問答
  3. 行內容獨立可點擊區域

行內容獨立可點擊區域

2012-10-28 97 views
2

注意：如果您因爲遇到類似問題而來到這裏，請確保您閱讀並嘗試提供的所有答案。看來在某些情況下，人們可能比另一個人工作得更好。所以做你自己的測試！行內容獨立可點擊區域

前言

我ListView的行佈局像這樣（這是剝奪了我的真實佈局的版本，所以不要的東西像包裹在的LinearLayout等單要素評價 - 這只是爲了說明問題 - 最終版本得到了更多的元素存在）：

enter image description here

XML文件如下以供參考，但我簡短描述我想達到的目標：

  • 藍框（圖標）和「此處通常爲長文本」TextView爲行「真實」內容（item_main_container）。它可以是任何東西 - 它應該是無關緊要的。此圖層內容不可點擊。事實上（但我剛剛意識到），我應該顯示「藍色方塊」被紅色半覆蓋，而下一層被綠色方框覆蓋一半。
  • 紅色和綠色框是視圖我綁定行的OnCliclListeners（包裹在item_click_area_container） - 我只是希望用戶能夠點擊行，不管item_main_container的內容真的是（所以這些紅色/綠色是透明的應用程序）。 注意：它們在圖像上設置爲透明，因此您可以通過它看到item_main_content，但它僅用於演示目的。另請注意，紅色和綠色代表單獨的動作，我需要能夠在item_click_area_container圖層上具有更多元素，以便能夠根據用戶點擊的位置處理更多操作。
  • 黃色區域（button_bar_container）保存用戶可能想要點按的按鈕。

所以基本上item_click_area_container覆蓋item_main_container，但不button_bar_container，也就是上面item_click_area_container否則用戶將無法通過點擊任意按鈕，它的。在角度來看，這將是：

enter image description here

佈局輪廓如下：

enter image description here

問題

我無法正確地作出item_click_area_container伸展覆蓋儘管我付出了努力，但它應該儘可能地保持整個item_main_container。由於"usually long text here"文字可以是任意長度，我不知道item_main_container的高度是多少。在下面的XML中有android:layout_height="100dp - 這個工作方式我看到所有的行元素，但是對於更長的文本item_click_area_container高度太小。但如果我用android:layout_height="fill_parent"替換它，那麼整個item_click_area_container是不可見的，這打破了目的。

質詢

  1. 爲什麼這是行不通的預期和/或如何解決呢？
  2. 有具有比使用像我item_click_area_container（但不包括基於OnTouchListener解決方案）的方法依賴於內容的點擊區域沒有更好的辦法？

佈局XML

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/item_container" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical"> 

    <RelativeLayout 
     android:layout_width="fill_parent" 
      android:layout_height="wrap_content"> 

     <LinearLayout 
      android:id="@+id/item_main_container" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content"> 

      <ImageView 
       android:id="@+id/item_avatar" 
       android:layout_width="40dp" 
       android:layout_height="40dp" 
       android:background="#0000ff" 
       android:src="@drawable/icon_help"/> 

      <LinearLayout 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:orientation="vertical"> 

       <TextView android:id="@+id/item_body" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:text="Usually long text here..." 
       android:textColor="#ffffff"/> 
      </LinearLayout> 

     </LinearLayout> 

     <LinearLayout 
       android:id="@+id/item_click_area_container" 
       android:layout_width="fill_parent" 
       android:layout_height="100dp"> 
      <LinearLayout 
       android:id="@+id/green_click" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:layout_weight="1" 
       android:background="#7700ff00"> 
      </LinearLayout> 
      <LinearLayout 
       android:id="@+id/red_click" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:layout_weight="2" 
       android:background="#77ff0000"> 
      </LinearLayout> 
     </LinearLayout> 

    </RelativeLayout> 

    <LinearLayout 
     android:id="@+id/button_bar_container" 
     android:layout_width="fill_parent" 
     android:layout_height="50dp" 
     android:layout_marginTop="3dp" 
     android:background="#ffff00"> 
    </LinearLayout> 

</LinearLayout>

編輯＃1

我想我可以使用OnTouchListener，並在onTouch()檢查event.getAction()，如果它是MotionEvent.ACTION_DOWN [R先閱讀事件的X/Y並檢查視圖的邊界。這可能會訣竅，但是，如果可能的話，我寧願單獨堅持使用OnClickListener。且不說它會有助於理解當前的罪魁禍首是什麼，尤其是佈局ADT

正確呈現

來源

2012-10-28 Marcin Orlowski

+1

我相信加入'OnClickListener'到'item_main_container'還將努力 – Thomas

+0

我第一次拒絕了這個提示，但休息後，我的文檔再次潛伏，我認爲它確實可以。你可以使用onTouchListener，檢查'event.getAction（）'，如果它是'MotionEvent.ACTION_DOWN'，則讀取事件的X/Y。這應該足夠了，但是我需要保留tap中的tap區域代碼，這是不是最完美的。但仍然可以是一個進步。需要調查。謝謝:) –

+0

正確的，應該是「button_bar_container」在覆蓋看到。糾正。是的，我也認爲它應該可以工作 - 但它不會，我不知道爲什麼。 –

回答

2

在這裏你走這個佈局將工作。簡單的解決辦法是到item_click_area_container的4個邊對齊使用這些4行item_main_container相應的4個方面：

 android:layout_alignTop="@+id/item_main_container" 
     android:layout_alignBottom="@+id/item_main_container" 
     android:layout_alignLeft="@+id/item_main_container" 
     android:layout_alignRight="@+id/item_main_container"

這裏是WRAP_CONTENT高度佈局。沒有更多的硬編碼的大小（：

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/item_container" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical" > 

    <RelativeLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" > 

     <LinearLayout 
      android:id="@+id/item_main_container" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" > 

      <ImageView 
       android:id="@+id/item_avatar" 
       android:layout_width="40dp" 
       android:layout_height="40dp" 
       android:background="#0000ff" 
       android:src="@drawable/ic_action_search" /> 

      <LinearLayout 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:orientation="vertical" > 

       <TextView 
        android:id="@+id/item_body" 
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent" 
        android:text="Usually long text hasdkfn ash jsjkgh sjhgjk hasjkh ash fjk hasdjkh fkjash jkdf hjkasdh fjkhasjkg hjkasjkd hfjkash gsdgh kgh sdfh fjksah djkfasd jkg jsdf asgjf sg sd agfgas fjhasg f asdgf gjhsdg sdjhsdg fasdfjhs agjhfg adf asdg jh dvhsdvjhas gdh fv gsfjivhdfvjksfgjkdhjhixcgzvjk gdshg dfg v gvgdfgvjkshvjksdgvsdvere..." 
        android:textColor="#000" /> 
      </LinearLayout> 
     </LinearLayout> 

     <LinearLayout 
      android:layout_alignTop="@+id/item_main_container" 
      android:layout_alignBottom="@+id/item_main_container" 
      android:layout_alignLeft="@+id/item_main_container" 
      android:layout_alignRight="@+id/item_main_container" 
      android:id="@+id/item_click_area_container" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" > 

      <LinearLayout 
       android:id="@+id/green_click" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:layout_weight="1" 
       android:background="#7700ff00" > 
      </LinearLayout> 

      <LinearLayout 
       android:id="@+id/red_click" 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:layout_weight="2" 
       android:background="#77ff0000" > 
      </LinearLayout> 
     </LinearLayout> 
    </RelativeLayout> 

    <LinearLayout 
     android:id="@+id/button_bar_container" 
     android:layout_width="fill_parent" 
     android:layout_height="50dp" 
     android:layout_marginTop="3dp" 
     android:background="#ffff00" > 
    </LinearLayout> 

</LinearLayout>

來源

2012-11-02 19:22:12

+1

解決這個問題的好辦法，但在所有測試之後，我認爲由於缺乏「錨定依賴性」，Marina的方法更加清晰。謝謝你的幫助。 –

+0

只是一個說明，希望這將有助於某人某天:) - 我設法創建另一個佈局，導致我的問題中描述類似的麻煩，我無法解決使用FrameLayout方法**在Android 2.x **（它在更高的版本中工作），但幸運的是，謝里夫的技巧運行良好。所以我現在有點難過，我沒能把恩惠分成一半...... –

+1

hehe @ WebnetMobile.com沒問題。積極思考：現在我們有兩種解決方案。 –

2

你可以嘗試更換您的

<RelativeLayout 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content">...</RelativeLayout>

與

<FrameLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content">...</FrameLayout>

然後把params的item_click_area_container至fill_parent/match_parent，使其成長爲覆蓋與item_main_container相同的區域。

如果您使用擴展LinearLayout用於處理你需要的紅色和綠色的區域的動作類，你應該確定。

來源

2012-10-31 03:50:50

+0

我已經試過這個，但它並不像我希望的那樣工作。我注意到與RelativeLayout缺乏正確拉伸相同的奇怪行爲。無論如何都會嘗試其他與FrameLayout的組合，所以謝謝你的提示。但我不確定它會適用於所有情況，因爲與RelativeLayout相比，對齊選項有限 –

0

你可以做這樣的事情。

在單獨的元素在你的Android layout.xml：的onClick

<LinearLayout 
     android:id="@+id/red_click" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:layout_weight="2" 
     android:background="#77ff0000"> 
    android:onClick="redAreaClicked" 
    </LinearLayout>

在你的java文件編寫與下面的代碼的方法redAreaClicked（）。

public void redAreaClicked(View v) { 
     RelativeLayout ParentRow = (RelativeLayout) v.getParent(); 
     final int position = mList.getPositionForView(ParentRow); 
     // more code here.. 
    }

這應該給你在列表中的位置。即行號。 但是，這個工作你必須在一個父母內部移動你所有的子視圖（彩色視圖，你的情況線性佈局）。使用相對佈局，我認爲這是非常可行的。

否則，您可以使用view.getId（）和比較，以獲得父視圖。然後確定它在列表中的位置。

您可以對其他顏色的區域做同樣的操作。

來源

2012-10-31 04:16:06 Aditya

+0

這不是一個解決方案。 「item_click_area_container」的內容可以附加到唯一的區域點擊監聽器。 –

相關問題

 相關問題