配件的ImageView和TextView的在布局

问题描述：

我有水平的ListView与以下项目：配件的ImageView和TextView的在布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="vertical" > 

    <ImageView 
     android:id="@+id/thumbnail" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:paddingLeft="5dp" 
     android:paddingRight="5dp" 
     android:src="@drawable/a" /> 

    <TextView 
     android:id="@+id/title" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:gravity="center_horizontal" 
     android:text="Title" 
     android:textColor="#FFFFFF" /> 

</LinearLayout>

这基本上是缩览图和它下面的一些文字。问题是 - 在ListView中显示此项目时，底部的文本仅部分可见 - 底部部分消失。看起来像ImageView不适合缩放以适应TextView。

但是，如果你把TextView放在ImageView上面，一切看起来都很好 - ImageView缩小了，文本完全适合。所以为什么？

让我说明：

在底部

TextView at bottom

的TextView的TextView在顶部（完美比例缩小图像）

TextView at top

按要求的main.xml：

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

    <LinearLayout 
     android:id="@+id/linearLayout0" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="10" 
     android:orientation="vertical" > 

     <TextView 
      android:id="@+id/textView1" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Top Activity Header" 
      android:textAppearance="?android:attr/textAppearanceLarge" /> 
    </LinearLayout> 

    <LinearLayout 
     android:id="@+id/linearLayout1" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="90" 
     android:orientation="vertical" 
     android:weightSum="100" > 

     <LinearLayout 
      android:background="#6056CC" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_weight="30" 
      android:orientation="vertical" > 

      <TextView 
       android:id="@+id/textView1" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="Top" 
       android:textAppearance="?android:attr/textAppearanceLarge" /> 
     </LinearLayout> 

     <LinearLayout 
      android:layout_width="fill_parent" 
      android:layout_height="0dp" 
      android:layout_weight="40" > 

      <test.name.Coverflow 
       android:id="@+id/coverflow" 
       android:layout_width="wrap_content" 
       android:layout_height="fill_parent" /> 
     </LinearLayout> 

     <LinearLayout 
      android:background="#BF5E76" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_weight="30" 
      android:orientation="vertical" > 

     </LinearLayout> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_height="65dp" 
     android:id="@+id/linearLayout2" 
     style="@style/TabPanel"> 

    </LinearLayout> 

</LinearLayout>

底部的红色块代表什么？它可以重叠的文字？ – Craigy

现在它只是带有背景色的空LinearLayout。我用不同颜色的块着色，以确保它们不重叠。 – Sver

答

你可以使用相对布局this.it可能会帮助你。下面的代码

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="vertical" > 

    <ImageView 
    android:id="@+id/thumbnail" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:paddingLeft="5dp" 
    android:paddingRight="5dp" 
    android:src="@drawable/a" /> 

    <TextView 
    android:id="@+id/title" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:gravity="center_horizontal" 
    android:text="Title" 
    android:textColor="#FFFFFF" 
    android:layout_below="@id/thumbnail"/> 

    </RelativeLayout>

使用RelativeLayout的，你可以设置的TextView的ImageView的下方，这样的ImageView和TextView中可以换。

编辑：

<RelativeLayout> 
     <LinearLayout 
     android:id="@+id/linearlayout1"> 
      //here the textview and imageview code 
     </LinearLayout> 
     <LinearLayout 
     android:layout_below="@id/linearlayout1" 
     > 
     //here the redblock code 
    </LinearLayout>

所以现在整个redblock会低于前layout..may b有益

结果与使用LinearLayout相同:(我更新了屏幕截图的问题 – Sver

你能否发布完整的xml文件...可能会检查我的回答中的编辑部分 – deepa

我添加了主版面源代码 – Sver

答

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:background="@android:color/white" 
    android:gravity="center_vertical" > 

    <TableLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:gravity="center_vertical" > 

     <TableRow 
      android:layout_gravity="left" 
      android:padding="5dp" > 

      <ImageView 
       android:id="@+id/thumbnail" 
       android:layout_width="100dp" 
       android:layout_height="100dp" 
       android:paddingLeft="5dp" 
       android:paddingRight="5dp" 
       android:src="@drawable/a" 
       android:layout_gravity="left"> 
      </ImageView> 
     </TableRow> 

     <TableRow 
      android:gravity="left" 
      android:padding="5dp" > 

      <TextView 
       android:id="@+id/title" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_marginLeft="5dp" 
       android:textColor="@android:color/black" 
       /> 
     </TableRow> 
    </TableLayout> 

</LinearLayout>

请试试这个。希望这会有所帮助。

对不起，没有为我工作 – Sver

而不是给予** adroid：layout_width =“wrap_content”android：layout_height =“wrap_content”**为ImageView尝试通过指定它的高度和宽度 – Ian

这是一个糟糕的主意，我希望它能够适应不同的屏幕尺寸。 – Sver

答

所以，嘿，我有这个同样的问题，这是我做过什么来得到它的工作：

<LinearLayout 
      android:layout_width="0dip" 
      android:layout_height="fill_parent" 
      android:layout_weight="1" 
      android:orientation="vertical" 
      android:layout_gravity="center|center_vertical"> 

      <ImageView 
       android:id="@+id/imageView2" 
       android:layout_width="wrap_content" 
       android:layout_height="0dip" 
       android:layout_weight="2" 
       android:adjustViewBounds="true" 
       android:scaleType="fitEnd" 
       android:layout_gravity="center|center_vertical" 
       android:src="@drawable/ic_pen" /> 

      <TextView 
       android:id="@+id/textView1" 
       android:layout_width="wrap_content" 
       android:layout_height="0dip" 
       android:layout_weight="1" 
       android:layout_gravity="center|center_vertical" 
       android:text="@string/main_write" 
       android:textColor="@color/color_darkgray" 
       android:textSize="24sp" /> 
     </LinearLayout>

关键是要设置的TextView和的ImageView layout_height为“0dip”。将ImageView的layout_weight设置为“2”，将TextView的layout_weight设置为“1”。将ImageView的缩放类型设置为“fitEnd”。将adjustViewBounds设置为“true”等瞧！即使在上下缩放时也能正常工作，因此不会丢失TextView，只会缩小图像。

配件的ImageView和TextView的在布局

相关推荐