Creating List view items with rounded corners fails

Question

I am developing an application which has a List View in it. I want each List View item to be round cornered. I have tried to do so but I failed to achieve my requirement instead of each item in List View the entire List View became round cornered and List items remained like a default List view items.Can anyone help me achieve my requirement.Below is my Layout files for List View.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".list_activity"
android:background="@android:color/darker_gray">

<LinearLayout
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true"
    android:background="@drawable/listview_roundcorners">

    <ListView
        android:layout_width="322dp"
        android:layout_height="446dp"
        android:id="@+id/list"
        android:layout_gravity="center_horizontal"
        android:background="@drawable/border"
        android:divider="@android:color/black"
        android:dividerHeight="5dp"
        android:clickable="true"
        android:visibility="visible" />
</LinearLayout>

Here is the code for listview_roundcorners.xml in drawable folder which I am setting as the background for LinearLayout.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:gradientandroid="http://schemas.android.com/tools"
xmlns:cornersandroid="http://schemas.android.com/apk/res-auto"
android:shape="rectangle">
<gradient
    android:startColor="#aaa"
    android:endColor="#aaa"
    android:angle="270"/>
<corners
    android:bottomRightRadius="7dp"
    android:bottomLeftRadius="7dp"
    android:topLeftRadius="7dp"
    android:topRightRadius="7dp"/>
</shape>

Here is the code for border.xml in drawable folder which I am setting as background for my List View.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<stroke android:width="1dp" 
android:color="#FFFFFF" />

<padding android:left="5dp" 
android:top="5dp" 
android:right="5dp" 
android:bottom="5dp" />

<corners android:radius="8dp" />
</shape>

my activity class is below

public class list_activity extends AppCompatActivity {
private ArrayAdapter<String> adapter;
private List<String> liste;
private ListView list;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_list_activity);
    String[] values = new String[] { "Android", "iPhone", "WindowsMobile",
            "Blackberry", "WebOS", "Ubuntu", "Windows7", "Max OS X",
            "Linux", "OS/2" };
    liste = new ArrayList<String>();
    Collections.addAll(liste, values);
    adapter = new ArrayAdapter<String>(this,
            android.R.layout.select_dialog_multichoice, liste);
    list = (ListView)findViewById(R.id.list);
    list.setAdapter(adapter);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.menu_list_activity, menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // Handle action bar item clicks here. The action bar will
    // automatically handle clicks on the Home/Up button, so long
    // as you specify a parent activity in AndroidManifest.xml.
    int id = item.getItemId();

    //noinspection SimplifiableIfStatement
    if (id == R.id.action_settings) {
        return true;
    }

    return super.onOptionsItemSelected(item);
}
}

instead of giving background to listView consider giving background to listView item. — vijaypalod, Feb 02 '16 at 12:01
**consider the following link** http://stackoverflow.com/questions/1683185/how-do-i-create-a-listview-with-rounded-corners-in-android — krishna, Feb 02 '16 at 12:02
The LinearLayout is perfectly **useless**. And lowers the performances, by introducing a level of nesting. — Phantômaxx, Feb 02 '16 at 12:06
you can use [`CardView`](http://developer.android.com/intl/es/reference/android/support/v7/widget/CardView.html) instead of setting rounded corner drawable to linearlayout — Kaushik, Feb 02 '16 at 12:21

score 1 · Answer 1 · answered Feb 02 '16 at 12:26

1

you do it in the layout of your list item, the item you inflate from the adapter's getView() method. In the file you inflate from getView(), apply listview_roundcorners.xml as background to the root tag of your view hierarchy.

answered Feb 02 '16 at 12:26

Samvid Mistry

783
1
8
14

Rajesh Satvara · Answer 2 · 2016-02-02T12:35:49.997

Create shape.xml file in Drawable folder and put this xml in it and change the color as per you need .

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/shape_my">
    <stroke android:width="4dp" android:color="#636161" />
    <padding android:left="5dp"
        android:top="5dp"
        android:right="5dp"
        android:bottom="5dp" />
    <corners android:radius="24dp" />
    <solid android:color="#FFF" />
</shape>

create one listitemdata.xml file for binding the data and set Layout background android:background="@drawable/shape"

listitemdata.xml file

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="match_parent"
        android:layout_height="240dp"
        android:layout_marginBottom="10dp"
        android:background="@color/Pink">

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:weightSum="1"
            android:layout_marginTop="20dp"
            android:layout_marginLeft="8dp"
            android:layout_marginRight="12dp"
            android:background="@drawable/shape"> <!--here is shape file-->

            <LinearLayout
                android:orientation="vertical"
                android:layout_width="0dp"
                android:layout_weight="0.80"
                android:layout_marginTop="14dp"
                android:layout_marginLeft="14dp"
                android:weightSum="1"
                android:layout_height="160dp">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:text="Large Text"
                    android:id="@+id/title" />

                <RelativeLayout
                    android:layout_width="40dp"
                    android:layout_height="20dp"
                    android:layout_marginTop="-20dp"
                    android:layout_marginLeft="236dp">


                </RelativeLayout>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAppearance="?android:attr/textAppearanceSmall"
                    android:text="Small Text"
                    android:id="@+id/desc" />        

     </LinearLayout> 
 </LinearLayout>
    </RelativeLayout>

this gives the same result as my code. it makes the top two corners of first item and bottom two corners of last item rounded. I want all the four corners of all the items to be rounded. — Arun, Feb 02 '16 at 12:14

score 0 · Answer 3 · answered Feb 02 '16 at 12:13

0

u have to set android:background="@drawable/border" to the listView item layout and not on the listView

answered Feb 02 '16 at 12:13

JAAD

12,349
7
36
57

post your listView item layout – JAAD Feb 02 '16 at 12:17
I don't have any List View Item layout. its just a normal list I am not using any textView . – Arun Feb 02 '16 at 12:19
then u have to make one and set android:background="@drawable/border" to that layout – JAAD Feb 02 '16 at 12:20
@Arun are you using custom adapter? – Shijil Feb 02 '16 at 12:24
I have posted my activity now – Arun Feb 02 '16 at 12:28
make a custom adapter to do this – JAAD Feb 02 '16 at 12:29
ok i will try doing that but is there no way i can achieve it using my current code. – Arun Feb 02 '16 at 12:31
i dont know any way u can do it with this inbuilt adapter – JAAD Feb 02 '16 at 12:33

score 0 · Answer 4 · answered Feb 02 '16 at 12:33

0

Create a layout file containing the textview you want with curved corner, and then use it with the ArrayAdapter.

e.g. yourtextview.xml

    <?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/text1"
    android:layout_width="match_parent"
    android:background="@drawable/border"
    android:layout_height="match_parent"/>

use it with ArrayAdapter

adapter = new ArrayAdapter<String>(this,R.layout.yourtextview, liste);
    list = (ListView)findViewById(R.id.list);
    list.setAdapter(adapter);

answered Feb 02 '16 at 12:33

Shijil

2,226
18
33

adapter = new ArrayAdapter(this,R.layout.yourtextview, liste); this line gives error. – Arun Feb 02 '16 at 12:52
make a layout with that name – JAAD Feb 02 '16 at 12:54
yes i created a Layout called text_view.xml and copied the code into that and tried , adapter = new ArrayAdapter(this,R.layout.text_view, liste); but it gives error. – Arun Feb 02 '16 at 12:56

Creating List view items with rounded corners fails

4 Answers4