android - 如何修复小屏幕上列表项中的“隐藏”布局（QVGA/HVGA）

Question

我有这样ListView定义的一行（Eclipse Android SDK 中图形视图的屏幕截图）：

问题是，在这一行中，只有在小屏幕上，最后一个布局元素（星形）是“隐藏的”。在更大的屏幕上，相同的布局 XML 看起来/工作正常（和在 IDE 中看到的一样）。

这种意外的布局行为发生在设备和模拟器以及所有版本（API 8 - 19）上。

我注意到（原始）上的错误LinearLayout：

<?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="72dp"
  android:background="@color/transparent" >

  <LinearLayout
    android:id="@+id/list_row_checkBox_container"
    android:layout_width="48dp"
    android:layout_height="fill_parent"
    android:clickable="true"
    android:gravity="center" >

    <CheckBox
      android:id="@+id/list_row_checkBox"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_gravity="center"
      android:text="" />
  </LinearLayout>

  <LinearLayout
    android:id="@+id/list_row_text"
    android:layout_width="0dp"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:orientation="vertical" >

    <TextView
      android:id="@+id/list_row_txtTitle"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:singleLine="true"
      android:text="Title"
      android:textSize="30sp" />

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

      <TextView
        android:id="@+id/list_row_txtExtra1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="12dp"
        android:text="First" />

      <TextView
        android:id="@+id/list_row_txtExtra2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="12dp"
        android:text="Second" />
    </LinearLayout>
  </LinearLayout>

  <LinearLayout
    android:layout_width="48dp"
    android:layout_height="fill_parent"
    android:gravity="center" >

    <!-- android:background="@color/green" -->

    <ImageButton
      android:id="@+id/list_row_select_icon"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:background="@android:color/transparent"
      android:clickable="true"
      android:src="@drawable/btn_star_holo_light_off" />
  </LinearLayout>

</LinearLayout>

结果：

当我按下星形按钮时，可以看到（到位）：

在那之后，自然地，我检查了适配器（ArrayAdapter带有视图支架模式的标准），但除了OnTouchListener按钮上的 a 之外什么都没有。接下来，我尝试更改行项目的根布局，首先是RelativeLayout：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="72dp"
  android:background="@color/transparent" >

  <LinearLayout
    android:id="@+id/list_row_checkBox_container"
    android:layout_width="48dp"
    android:layout_height="fill_parent"
    android:layout_alignParentTop="true"
    android:clickable="true"
    android:gravity="center" >

    <CheckBox
      android:id="@+id/list_row_checkBox"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_gravity="center"
      android:text="" />
  </LinearLayout>

  <LinearLayout
    android:id="@+id/list_row_text"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignParentTop="true"
    android:layout_marginRight="48dp"
    android:layout_toRightOf="@+id/list_row_checkBox_container"
    android:orientation="vertical" >

    <TextView
      android:id="@+id/list_row_txtTitle"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:singleLine="true"
      android:text="Title"
      android:textSize="30sp" />

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

      <TextView
        android:id="@+id/list_row_txtExtra1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="12dp"
        android:text="First" />

      <TextView
        android:id="@+id/list_row_txtExtra2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="12dp"
        android:text="Second" />
    </LinearLayout>
  </LinearLayout>

  <LinearLayout
    android:layout_width="48dp"
    android:layout_height="fill_parent"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:gravity="center" >

    <ImageButton
      android:id="@+id/list_row_select_icon"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:background="@android:color/transparent"
      android:clickable="true"
      android:src="@drawable/btn_star_holo_light_off" />
  </LinearLayout>

</RelativeLayout>

结果：

最后，我尝试了FrameLayout：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="72dp"
  android:background="@color/transparent" >

  <LinearLayout
    android:id="@+id/list_row_checkBox_container"
    android:layout_width="48dp"
    android:layout_height="fill_parent"
    android:layout_gravity="top|left"
    android:clickable="true"
    android:gravity="center" >

    <CheckBox
      android:id="@+id/list_row_checkBox"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_gravity="center"
      android:text="" />
  </LinearLayout>

  <LinearLayout
    android:id="@+id/list_row_text"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_gravity="top|left"
    android:layout_marginLeft="48dp"
    android:layout_marginRight="48dp"
    android:orientation="vertical" >

    <TextView
      android:id="@+id/list_row_txtTitle"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:singleLine="true"
      android:text="Title"
      android:textSize="30sp" />

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

      <TextView
        android:id="@+id/list_row_txtExtra1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="12dp"
        android:text="First" />

      <TextView
        android:id="@+id/list_row_txtExtra2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="12dp"
        android:text="Second" />
    </LinearLayout>
  </LinearLayout>

  <LinearLayout
    android:layout_width="48dp"
    android:layout_height="fill_parent"
    android:layout_gravity="top|right"
    android:gravity="center" >

    <ImageButton
      android:id="@+id/list_row_select_icon"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:background="@android:color/transparent"
      android:clickable="true"
      android:src="@drawable/btn_star_holo_light_off" />
  </LinearLayout>

</FrameLayout>

结果：

可以看出，没有任何帮助，我有点“困惑”。

请问如何解决这个问题？

Answer 1

首先检查您在创建布局时选择了什么设备它应该在图形布局 xml 的顶部栏上。默认布局文件夹适用于 4 - 7 英寸屏幕的设备。然而，布局故障也会发生在设备 DPI 的基础上。因此，您必须创建多个布局文件夹以支持不同的布局及其横向文件夹。

您不必创建这么多布局。这是因为您必须为具有不同屏幕尺寸和 dpi 的不同设备创建不同的布局。这就是明星走出银幕的原因。

http://developer.android.com/guide/practices/screens_support.html

转到此链接并阅读它。

Answer 2

解决方案是为图像添加drawable-mdpi资源到项目中btn_star_holo_light_off（只有drawable-xhdpi一个）。