如何在列表視圖的頂部和底部對列表項的角進行舍入？ （不僅適用於頂部和底部物品）

Question

我有一個頂部和底部有圓角的列表視圖。 看起來像這個圖像：

但是當我單擊ListView的頂部和底部時，List Item的背景是矩形而不是圓形作為ListView的頂部和底部背景。 喜歡這個圖片：

如何解決這個問題？

這是我的代碼：

1 / list_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#cacaca">

<ListView
    android:id="@+id/listView3"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="10dp"
    android:background="@drawable/list_border"
    android:listSelector="@drawable/list_selector"/>
</LinearLayout>

2 / list_border.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#fff"/>
<corners android:bottomRightRadius="10dp"
    android:bottomLeftRadius="10dp"
    android:topLeftRadius="10dp"
    android:topRightRadius="10dp"/>
</shape>

3 / list_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true"
        android:drawable="@color/colorPrimary" />
</selector>

4 / ListActivity.java

ListView listView = (ListView)findViewById(R.id.listView3);

ArrayList<String> listItems = new ArrayList<>();

for(int i=0;i<20;i++){
    listItems.add(""+i);
}

ArrayAdapter<String> adapter = new ArrayAdapter<>(getApplicationContext(), android.R.layout.simple_selectable_list_item, listItems);
listView.setAdapter(adapter);

Answer 1

這個解決方案並不漂亮，但它可以滿足您的需求。 想法是反轉角落並將它們繪制為前景：

ListView包裝在FrameLayout ：

<FrameLayout
      android:layout_width="match_parent"
      android:layout_height="0dp"
      android:layout_margin="10dp"
      android:foreground="@drawable/inverted_corners"
      android:layout_weight="1">
      <ListView
          android:id="@+id/listView3"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:background="#fff"
          android:listSelector="@drawable/list_selector" />
  </FrameLayout>

將前景（ drawable/inverted_corners.xml ）設置為圓孔 ，使用背景顏色繪制。 訣竅是在形狀外畫一條線 ，而不是填充形狀：

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:bottom="-11dp"
        android:left="-11dp"
        android:right="-11dp"
        android:top="-11dp">
        <shape android:shape="rectangle">
            <stroke
                android:width="10dp"
                android:color="#cacaca" />
            <corners android:radius="22dp" />
        </shape>
    </item>
</layer-list>

這可以確保圓角位於選擇器頂部，並具有過卷效果。

Answer 2

我建議你應該為你的ListView的第一個和最后一個元素設置帶角的布局，而不是整個ListView 。

除了list_selector.xml之外，您還可以創建兩個額外的.xml文件：一個用於第一個元素，頂部有圓角（讓我們稱之為list_selector_top.xml ），另一個用於最后一個元素，底部有圓角（ list_selector_bottom.xml ）。

然后你可以創建自己的MyAdapter extends ArrayAdapter並在getView()方法的某個地方為你的元素的View設置適當的背景（如果position==0 set list_selector_top.xml ，if position==getCount()-1 set list_selector_bottom.xml ，by default set list_selector.xml ）。

它可能不是最簡單的方法，但它有效。

Answer 3

將您的角半徑設置為list view選擇器也使用此：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/list"
        android:state_pressed="true"
        >
        <shape>
        <solid android:color="@color/colorPrimary"/>
        <corners
            android:radius="10dp"/>
        </shape>
        </item>

</selector>

所以你的選擇不會是list view交叉邊界。

缺點 -你無法確定哪些radius你必須設置為每頂部和底部，這就是為什么要設置radius到四面八方。

希望這有助於或至少為您提供一些方向來解決您的問題。

Answer 4

如果可以使用FrameLayout作為ListView父級，則將角形形狀設置為父級FrameLayout foreground 。

<?xml version="1.0" encoding="utf-8"?>
    <FrameLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" 
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:foreground="@drawable/list_border">

    <ListView
        android:id="@+id/listView3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:listSelector="@drawable/list_selector"/>
    </FrameLayout>

如果你想使用的LinearLayout作為ListView控件的父母，然后環繞你ListView與ForegroundLinearLayout並設置有角的形狀作為foreground的ForegroundLinearLayout 。

什么是ForegroundLinearLayout ？ 它是帶有Foreground屬性的LinearLayout ，如FrameLayout 。 從Chris Banes那里獲取代碼。 https://gist.github.com/chrisbanes/9091754

你的代碼應該是：

<?xml version="1.0" encoding="utf-8"?>
<ForegroundLinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:foreground="@drawable/list_border">

<ListView
    android:id="@+id/listView3"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:listSelector="@drawable/list_selector"/>
</ForegroundLinearLayout>

Answer 5

請在你的style.i更新樣式添加填充。
2 list_border.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#fff"/>
<corners android:bottomRightRadius="10dp"
android:bottomLeftRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp"/>
<padding android:left="10dp"
      android:right="10dp"
      android:top="10dp"
      android:bottom="10dp"
      />
</shape>

Answer 6

這可以通過使用Android的支持庫的CardView輕松完成。 只需將ListView包裝在CardView布局中，並將cardCornerRadius設置為CardView ，如下所示：

        <?xml version="1.0" encoding="utf-8"?>
        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:orientation="vertical" android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#cacaca">

            <android.support.v7.widget.CardView
                xmlns:card_view="http://schemas.android.com/apk/res-auto"
                android:layout_height="wrap_content"
                android:layout_width="match_parent"
                card_view:cardCornerRadius="10dp"
                >

                <ListView
                    android:id="@+id/listView3"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:listSelector="@drawable/list_selector"/>
            </android.support.v7.widget.CardView>
        </LinearLayout>

CardView了導入CardView的支持庫：

compile 'com.android.support:cardview-v7:23.1.1'