自定义Listview奇怪的UI故障

时间:2014-08-27 13:11:29

标签: android android-layout android-listview

我正在努力为我的Android应用中的listviews调试一个奇怪的UI故障。 99%的时间一切看起来都像它应该的那样,但我的listviews时不时会表现得很奇怪。当您重新启动应用程序时,列表视图再次显示正常。

有谁知道这是否是一个已知的安卓漏洞?

它只是随机发生的事实(我试图弄清楚一种模式而且不能)让我感到害怕。我没能在网上找到类似问题的任何内容。希望我一直在搜索错误的搜索词。

非常感谢任何建议/帮助。

提前致谢。

列表视图通常如下所示:

What the listview looks like most of the time

列表视图不时出现的样子:

What happens every now and then

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:orientation="horizontal"
          android:layout_width="match_parent"
          android:layout_height="@dimen/tile_height_padded"
          android:descendantFocusability="blocksDescendants"
          android:layout_margin="0dp"
          android:padding="@dimen/padding_list">

<!--This is the clickable background of the item-->
<ImageView
        android:id="@+id/imageview_poi_tile_detail_button_detail"
        android:background="@color/ca"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="0dp"
        android:layout_toLeftOf="@+id/imageview_poi_tile_map_button"/>

<!--This is the Grey vertical line next to the icon on the left-->
<ImageView
    android:id="@+id/delimiter_poi_tile"
    android:layout_width="@dimen/delimiter_size"
    android:layout_height="@dimen/tile_description_height"
    android:layout_marginTop="@dimen/margin_list_vertical"
    android:layout_marginBottom="@dimen/margin_list_vertical"
    android:background="@color/git"
    android:layout_toRightOf="@id/imageview_poi_tile_icon"/>

<!--This is the red map button on the right-->
<ImageView
    android:id="@id/imageview_poi_tile_map_button"
    android:background="@color/lr"
    android:src="@drawable/map"
    android:scaleType="fitCenter"
    android:padding="@dimen/image_button_padding"
    android:layout_width="@dimen/button_size"
    android:layout_height="match_parent"
    android:layout_alignParentRight="true"/>

<!--This is the marker Icon on the left-->
<ImageView
        android:id="@+id/imageview_poi_tile_icon"
        android:src="@drawable/poidefaultgit"
        android:scaleType="fitStart"
        android:padding="@dimen/image_button_padding"
        android:background="@color/ca"
        android:layout_width="@dimen/button_size"
        android:layout_height="@dimen/tile_description_height"
        android:layout_margin="0dp"/>

<!--This is the bold title text, eg. BARONS-->
<TextView
        android:id="@+id/textview_poi_tile_type"
        android:background="@color/ca"
        android:paddingLeft="@dimen/padding_list"
        android:layout_margin="0dp"
        android:gravity="left|top"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textStyle="bold"
        android:text="Poi Type"
        android:ellipsize="end"
        android:maxLines="1"
        android:textColor="@color/git"
        android:layout_width="match_parent"
        android:layout_height="@dimen/tile_title_height"
        android:layout_toRightOf="@id/delimiter_poi_tile"
        android:layout_toLeftOf="@+id/textview_poi_tile_distance"/>

<!--This is the address that is shown, eg 3 ADDERLEY ST, CAPE TOWN,-->
<TextView
        android:id="@+id/textview_poi_tile_description"
        android:background="@color/ca"
        android:paddingLeft="@dimen/padding_list"
        android:layout_margin="0dp"
        android:gravity="left|top"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:text="Address"
        android:ellipsize="end"
        android:maxLines="1"
        android:textColor="@color/git"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/textview_poi_tile_type"
        android:layout_toRightOf="@id/delimiter_poi_tile"
        android:layout_toLeftOf="@id/imageview_poi_tile_map_button"/>

<!--This will display a string when the gps is on, not shown in image as gps was off in screenshot-->
<TextView
        android:id="@id/textview_poi_tile_distance"
        android:background="@color/ca"
        android:textColor="@color/lr"
        android:text=""
        android:paddingRight="@dimen/padding_list"
        android:layout_margin="0dp"
        android:gravity="left|top"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@id/imageview_poi_tile_map_button"/>

    @Override
    public View getView(int position, View convertView, ViewGroup parent)
    {
        TextView description;
        TextView type;
        TextView distance;
        ImageView imageView;
        ImageView mapIcon;
        ImageView clickableArea;

        if(convertView == null)
        {
            convertView = LayoutInflater.from(context).inflate(R.layout.listitem_poi, parent, false);

            description = (TextView) convertView.findViewById(R.id.textview_poi_tile_description);
            type = (TextView) convertView.findViewById(R.id.textview_poi_tile_type);
            distance = (TextView) convertView.findViewById(R.id.textview_poi_tile_distance);
            imageView = (ImageView) convertView.findViewById(R.id.imageview_poi_tile_icon);
            mapIcon = (ImageView) convertView.findViewById(R.id.imageview_poi_tile_map_button);
            clickableArea = (ImageView) convertView.findViewById(R.id.imageview_poi_tile_detail_button_detail);

            convertView.setTag(new ViewHolder(description, type, distance, imageView, mapIcon, clickableArea));
        }
        else
        {
            ViewHolder viewHolder = (ViewHolder) convertView.getTag();

            description = viewHolder.description;
            type = viewHolder.type;
            distance = viewHolder.distance;
            imageView = viewHolder.imageView;
            mapIcon = viewHolder.mapIcon;
            clickableArea = viewHolder.clickableArea;
        }

        final int finalIndex = position;
        final PointOfInterest poi = getItem(position);

        description.setText(poi.getDescription());
        type.setText(poi.getName());

        imageView.setImageResource(R.drawable.poidefaultgit);

        distance.setText(poi.getDistance()); 

        return convertView;
    }

3 个答案:

答案 0 :(得分:2)

我认为有几件事导致了这一点。根据经验,我注意到RelativeLayout有时根据可用空间不适合它的孩子。如果某个孩子的某个侧面没有在某个地方被正确绑定,那么它会立即被修剪掉。另外,我认为TextView的一些尺寸不足以显示文本。我在这里做了以下的事情,所以它可能需要一些调整,但它应该绘制布局的图片来尝试。不幸的是,它不像你当前的XML那样平坦,但它应该有希望解决你的问题。抱歉,目前无法在计算机上进行测试。

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

    <!--This is the marker Icon on the left-->
    <!--Use margin if you need more space to divider-->
    <ImageView
        android:id="@+id/imageview_poi_tile_icon"
        android:src="@drawable/poidefaultgit"
        android:scaleType="fitStart"
        android:padding="@dimen/image_button_padding"
        android:background="@color/ca"
        android:layout_width="@dimen/button_size"
        android:layout_height="match_parent"/>

    <!--This is the Grey vertical line next to the icon on the left-->
    <!--Use margin to determine how close the line is to the top/bottom of item-->
    <ImageView
        android:id="@+id/delimiter_poi_tile"
        android:layout_width="@dimen/delimiter_size"
        android:layout_height="match_parent"
        android:layout_marginTop="@dimen/margin_list_vertical"
        android:layout_marginBottom="@dimen/margin_list_vertical"
        android:src="@color/git"
        android:background="@color/ca"/>

    <RelativeLayout
        android:gravity="center_vertical"
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:background="@color/ca">

        <!--This is the bold title text, eg. BARONS-->
        <TextView
            android:id="@+id/textview_poi_tile_type"
            android:paddingLeft="@dimen/padding_list"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:textStyle="bold"
            android:text="Poi Type"
            android:ellipsize="end"
            android:maxLines="1"
            android:textColor="@color/git"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

        <!--This is the address that is shown, eg 3 ADDERLEY ST, CAPE TOWN,-->
        <TextView
            android:id="@+id/textview_poi_tile_description"
            android:paddingLeft="@dimen/padding_list"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:text="Address"
            android:ellipsize="end"
            android:maxLines="1"
            android:textColor="@color/git"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/textview_poi_tile_type"/>

        <!--This will display a string when the gps is on, not shown in image as gps was off in screenshot-->
        <TextView
            android:id="@id/textview_poi_tile_distance"
            android:textColor="@color/lr"
            android:text=""
            android:paddingRight="@dimen/padding_list"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/textview_poi_tile_type"/>
    </RelativeLayout>

    <!--This is the red map button on the right-->
    <ImageButton
        android:id="@id/imageview_poi_tile_map_button"
        android:background="@color/lr"
        android:src="@drawable/map"
        android:scaleType="fitCenter"
        android:padding="@dimen/image_button_padding"
        android:layout_width="@dimen/button_size"
        android:layout_height="match_parent"/>
</LinearLayout>

这里的想法是让LinearLayout中的整个项目包含内容的大小。依靠它将水平放置到位。然后只将TextViews包裹在Relativelayout中。只需将TextViews对齐在彼此的下方和侧面。让RelativeLayout担心实际上将它们集中在一起。它的加权以确保它伸展以水平填充任何剩余空间。

此外,您的地图按钮可以是ImageButton。您不需要仅查看项目点击事件的视图。根布局本身可以按原样执行。您可能遇到了此设置的问题。查看this post,它会告诉您在嵌入ImageButton时如何正确获取行。

答案 1 :(得分:0)

每次尝试充气新视图而不是重复使用它们。我知道这不是最好的事情,但在某些时候我遇到了类似的问题,这是唯一有效的方法。

答案 2 :(得分:0)

感谢您的帮助。我设法清理了很多布局文件。

发生UI故障的原因是由于加载了错误的样式文件。它只发生在我使用该样式之前加载另一个元素时。为了解决这个问题,我专门为listviews创建了一个新样式,并将其分配给listview元素。