TextView에서 ImageView를 화면 밖으로 밀지 않도록하는 방법

Question

동적으로 레이아웃을 생성하고 있는데 반복 행 구조가 포함 된 menu_row_element.xml 파일이 있습니다.

이미지를 포함하는 LinearLayout (가로), 작은 이미지 위의 큰 텍스트, 오른쪽 화살표가있는 ImageView (다른 LinearLayout의 오른쪽 정렬)로 구성됩니다.

텍스트 부분이 작을 때 모든 것이 잘 보입니다. 그러나 텍스트 부분이 길면 오른쪽 화살표가 화면에서 밀려납니다.

어떻게하면 화면에서 오른쪽 화살표를 항상 오른쪽 정렬 상태로 유지하고 textviews가 텍스트를 적절히 감쌀 수 있습니까?

이 이미지에서 텍스트는 작기 때문에 마지막 행은 OK이지만 행 1과 2는 화면에서 오른쪽 화살표를 누 릅니다.

a busy cat http://img706.imageshack.us/img706/2927/device20111221203115.jpg

XML 파일은 다음과 같습니다

<?xml version="1.0" encoding="utf-8"?> 
    <LinearLayout 
     xmlns:android="http://schemas.android.com/apk/res/android" 
     android:clickable="true" 
     android:background="@drawable/main_menu_button" 
     android:paddingTop="5dp" 
     android:paddingBottom="5dp" 
     android:orientation="horizontal" 
     android:gravity="left|center_vertical" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content"> 

     <!-- Icon of each section --> 
     <ImageView 
      android:id="@+id/menu_icon" 
      android:layout_width="wrap_content" 
      android:layout_height="fill_parent" 
      android:padding="10px" /> 

     <!-- Text, in two parts --> 
     <LinearLayout 
      android:orientation="vertical" 
      android:paddingLeft="10px" 
      android:layout_width="wrap_content" 
      android:layout_height="fill_parent"> 

      <!-- Big font text --> 
      <TextView 
       android:id="@+id/menu_element_big_text" 
       android:textSize="20dp" 
       android:textColor="@color/black" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" /> 

      <!-- Small font text --> 
      <TextView 
       android:id="@+id/menu_element_small_text" 
       android:scrollHorizontally="false" 
       android:textSize="15dp" 
       android:textColor="@color/black" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" /> 
     </LinearLayout> 

     <!-- Layout just to be able to right align, sheesh! --> 
     <LinearLayout 
      android:gravity="right|center_vertical" 
      android:orientation="horizontal" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent"> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="fill_parent" 
       android:padding="0dp" 
       android:src="@drawable/right" /> 
     </LinearLayout> 

    </LinearLayout> 

감사합니다!

Answer 1

RelativeLayout을 사용하십시오.

<LinearLayout> <!--This is the outer one and will contain everything else--> 
     <RelativeLayout> <!-- width: fill, height: wrap, one of these for each row--> 
      <ImageView 
       android:id="@+id/rightArrow" 
       android:layout_alignParentRight="true"/> <!-- This is the arrow that points to the right wrap width and height--> 
      <ImageView 
       android:id="@+id/icon" 
       android:layout_alignParentLeft="true"/><!--This is the icon on the left wrap width and height--> 
      <TextView 
       android:id="@+id/largeText" 
       android:text="Large Text" 
       android:layout_alignParentBottom="true" 
       android:layout_toLeftOf="@+id/rightArrow" 
       android:layout_toRightOf="@+id/icon"/> <!-- fill width and wrap height--> 
      <TextView 
       android:id="@+id/smallText" 
       android:text="Small Text" 
       android:layout_below="@+id/largeText" 
       android:layout_toLeftOf="@+id/rightArrow" 
       android:layout_toRightOf="@+id/icon"/> <!-- fill width and wrap height--> 
     </RelativeLayout> 
    </LinearLayout> 

을 또는 당신이 선호하는 (이 아마 더 나은 실제로) 경우,이 작업을 수행 :

구조는해야

<LinearLayout> <!--This is the outer one and will contain everything else--> 
    <RelativeLayout> <!-- width: fill, height: wrap, one of these for each row--> 
     <ImageView 
      android:id="@+id/rightArrow" 
      android:layout_alignParentRight="true"/> <!-- This is the arrow that points to the right wrap width and height--> 
    <LinearLayout android android:layout_toLeftOf="@+id/rightArrow" 
      ><!--orientation:horizontal, fill width, wrap height--> 
     <ImageView 
      android:id="@+id/icon"/><!--This is the icon on the left wrap width and height--> 
     <TextView 
      android:id="@+id/largeText" 
      android:text="Large/> <!-- fill width and wrap height--> 
     <TextView 
      android:id="@+id/smallText" 
      android:text="Small Text"/> <!-- fill width and wrap height--> 
    </LinearLayout> 
    </RelativeLayout> 
</LinearLayout> 

Answer 2

당신은 당신의 선형 레이아웃을 유지할 수 있습니다. 텍스트 블록에 레이아웃 가중치 1을 지정하기 만하면됩니다. 이런 식으로 다른 레이아웃 안에 이미지 뷰를 배치 할 필요가 없습니다.

텍스트보기도 한 줄로 제한하고 싶을 것입니다.

<LinearLayout 
xmlns:android="http://schemas.android.com/apk/res/android" 
android:clickable="true" 
android:background="@drawable/main_menu_button" 
android:paddingTop="5dp" 
android:paddingBottom="5dp" 
android:orientation="horizontal" 
android:gravity="left|center_vertical" 
android:layout_width="fill_parent" 
android:layout_height="wrap_content"> 

<!-- Icon of each section --> 
<ImageView 
    android:id="@+id/menu_icon" 
    android:layout_width="wrap_content" 
    android:layout_height="fill_parent" 
    android:padding="10px" /> 

<!-- Text, in two parts --> 
<LinearLayout 
    android:orientation="vertical" 
    android:paddingLeft="10px" 
    android:layout_width="wrap_content" 
    android:layout_height="fill_parent" 
    android:layout_weight="1"> 

      <!-- Big font text --> 
    <TextView 
     android:id="@+id/menu_element_big_text" 
     android:scrollHorizontally="false" 
     android:singleLine="true" 
     android:textSize="20dp" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" /> 

    <!-- Small font text --> 
    <TextView 
     android:id="@+id/menu_element_small_text" 
     android:scrollHorizontally="false" 
     android:singleLine="true" 
     android:textSize="15dp" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" /> 
</LinearLayout> 

<ImageView 
    android:layout_width="wrap_content" 
    android:layout_height="fill_parent" 
    android:padding="0dp" 
    android:src="@drawable/right" />