TableRow의 내용이 화면 크기를 넘어서고 있습니다.

Question

왜 디자인상의 문제가 있는지 잘 모릅니다. 그게 내가 여기있는 이유입니다. 여기 이미지와 코드가 있습니다. 바라건대 너희들이 나를 도울 수 있기를 바랍니다.

는

http://i60.tinypic.com/fwr8mh.jpg (이미지 링크)

<TableRow 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" > 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="2:00 [Extended]" 
       android:textColor="#ffffff" /> 

      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/light" /> 
     </TableRow> 

감사합니다. [현재 코드] 요청으로

: 당신이 자신의 위치를 ​​제어 할 수

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="#2f4f4f" > 

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

     <TableLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" > 

      <TableRow 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:background="#36444e" > 

       <TextView 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:layout_weight="1" 
        android:gravity="center_horizontal" 
        android:text="Brewing:" 
        android:textColor="#ffff00" /> 
      </TableRow> 

      <TableRow 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:background="#36444e" > 

       <ImageView 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:layout_weight="1" 
        android:src="@drawable/ghasttear" /> 
      </TableRow> 

      <TableRow 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:background="#36444e" > 

       <ImageView 
        android:layout_width="wrap_content" 
        android:layout_height="32dp" 
        android:layout_weight="1" 
        android:src="@drawable/brewingarrow" /> 
      </TableRow> 

      <TableRow 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:background="#36444e" > 

       <ImageView 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:layout_gravity="" 
        android:layout_weight="1" 
        android:src="@drawable/waterbottle" /> 
      </TableRow> 


      <View 
       android:layout_width="match_parent" 
       android:layout_height="1dp" 
       android:background="#ffffff" /> 

      <TableRow 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" > 

       <TextView 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:layout_weight="1" 
        android:gravity="center_horizontal" 
        android:text="Potion Time" 
        android:textColor="#ffffff" /> 
      </TableRow> 

      <TableRow 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" > 

       <TextView 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:layout_weight="1" 
        android:gravity="center_horizontal" 
        android:text="0:45 [Non-Extended]" 
        android:textColor="#ffffff" /> 
      </TableRow> 

      <TableRow 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" > 

       <TextView 
        android:layout_width="50dp" 
        android:layout_height="wrap_content" 
        android:text="2:00 [Extended]" 
        android:textColor="#ffffff" 
        android:ellipsize="end" /> 

       <ImageView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:src="@drawable/light" /> 
      </TableRow> 

      <View 
       android:layout_width="match_parent" 
       android:layout_height="1dp" 
       android:background="#ffffff" /> 

      <TableRow 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" > 

       <TextView 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:layout_weight="1" 
        android:gravity="center_horizontal" 
        android:text="Potion Description" 
        android:textColor="#ffffff" /> 
      </TableRow> 

      <TableRow 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" > 

       <TextView 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:layout_weight="1" 
        android:gravity="center_horizontal" 
        android:text="Poyion time lasts for 0:45 when not extended." 
        android:textColor="#ffffff" /> 
      </TableRow> 
     </TableLayout> 
    </RelativeLayout> 

</RelativeLayout> 

Answer 1

그래서, 각 TableRow 구성 요소, 당신은 단지 하나의 아이 View. So, in order to have a 텍스트 뷰 and an 이미지 뷰 , you have to place those Views inside another View, like a있는 LinearLayout or a RelativeLayout`을 가질 수 있습니다.

그래서, TableRow 당신의 "문제"에, 그냥이로 변경 : (

이

 <TableRow 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" > 

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

       <TextView 
        android:layout_width="wrap_content" 
        android:id="@+id/extendedText" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:layout_alignParentLeft="true" 
        android:text="2:00 [Extended]" 
        android:textColor="#ffffff" /> 

       <ImageView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:layout_alignParentRight="true" 
        android:src="@drawable/light" /> 
      </RelativeLayout> 
     </TableRow> 

가 난 그냥 RelativeLayout 내부 ImageView과 TextView를 놓고 부모보기의 왼쪽에있는 TextView를 정렬하는 RelativeLayout) 및 오른쪽에 ImageView이 있습니다. 텍스트가 너무 길어지지 않으면 ellipsize 가치에 신경 쓰지 마십시오.