Change colour in ListView

Question

I'm trying to change the colour in a ListView because I want to use a white background. Without touching the ListView it is showing no Text. On touch the background switches to black and the Text is visible because the text is white. How can I change the Textcolour and avoid that the background changes it's colour when touching? Here is my code:

        public class LayoutNight extends Fragment {

        ListView myList;

        String[] listContent = {

                "Mo", 
                "Di", 
                "Mi",
                "Do",
                "Fr", 
                "Sa", 
                "So"

        };

        public static Fragment newInstance(Context context) {
            LayoutNight f = new LayoutNight();  

            return f;
        }

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
            ViewGroup root = (ViewGroup) inflater.inflate(R.layout.layout_night, null);     

            myList = (ListView)root.findViewById(R.id.list);

            ArrayAdapter<String> adapter

            = new ArrayAdapter<String>(getActivity(),

                    android.R.layout.simple_list_item_multiple_choice,

                 listContent);



            myList.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);

            myList.setAdapter(adapter);
// That was a try, but it crashed ...

    //        TextView myListText = (TextView)root.findViewById(R.id.list);
    //        myListText.setTextColor(color.black);

            return root;
        }

    }

EDIT

I did the suggestions of Raghunandan, but the background not changed. This is the untouched screenshot

This is the the screen at scrolling (unfortunately black)

And this is the screen at selecting an option

EDIT It's working now like following without changing the background while scrolling (Thanks to Pragnani and Raghunandan) but it is not clickable anymore. How can I make it clickable?

    <ListView
android:id="@+id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/listbkg"
android:drawSelectorOnTop="true"
android:cacheColorHint="@android:color/transparent">
</ListView>

list_row.xml

    <?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="5px"
        android:paddingBottom="5px"
        android:textSize="35sp"
        android:textColor="#000000"
        android:layout_gravity="center"
        android:maxHeight="75px"/>

Code:

    @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
    ViewGroup root = (ViewGroup) inflater.inflate(R.layout.layout_night, null);     

    myList = (ListView)root.findViewById(R.id.list);

    ArrayAdapter<String> adapter
    = new ArrayAdapter<String>(getActivity(),R.layout.list_row,listContent);

    myList.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);
    myList.setFocusable(true);
    myList.setClickable(true);
    myList.setAdapter(adapter);

    return root;
}

Answer 1

I just had to change the theme to Theme.Light, sorry I'm a beginner ...

This is now the ListView

    <ListView
android:id="@+id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@color/white"
android:drawSelectorOnTop="true"
android:cacheColorHint="@android:color/transparent">
</ListView>

And following the Code snippset

    @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
    ViewGroup root = (ViewGroup) inflater.inflate(R.layout.layout_night, null);     

    myList = (ListView)root.findViewById(R.id.list);

    ArrayAdapter<String> adapter
    = new ArrayAdapter<String>(getActivity(),android.R.layout.simple_list_item_multiple_choice,listContent);

    myList.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);

    View header = (View)inflater.inflate(R.layout.listview_header_row, null);

    myList.addHeaderView(header);        
    myList.setAdapter(adapter);

    return root;
}

Answer 2

I suggest you use a custom adapter. Easy for customization.

In your getview inflate yout custom layout.

http://developer.android.com/guide/topics/resources/drawable-resource.html. Check the topic under State list.

public View getView(final int arg0, View arg1, ViewGroup arg2) {
    final ViewHolder vh;
    vh= new ViewHolder();

    if(arg1==null )
        {
        arg1=mInflater.inflate(R.layout.customlayout, arg2,false);  
        }
    else
    {
     arg1.setTag(vh);
    }

    return arg1;
}

customlayout.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="horizontal"
 android:background="@drawable/listbkg" //set layout background
 android:cacheColorHint="#000000"
>
 // other ui elements. similarly you can set background for your other ui elements
 //android:background="@drawable/otherui"
 // define your own drawables when pressed and in normal state. 

</LinearLayout>

listbkg.xml in drawable folder

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

pressed.xml in drawable folder

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
<solid android:color="#FF1A47"/>    
<stroke android:width="3dp"
        android:color="#0FECFF"/>
<padding android:left="5dp"
         android:top="5dp"
         android:right="5dp"
         android:bottom="5dp"/> 
<corners android:bottomRightRadius="7dp"
         android:bottomLeftRadius="7dp" 
         android:topLeftRadius="7dp"
         android:topRightRadius="7dp"/> 
</shape>

normal.xml in drawable folder

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
<solid android:color="#FFFFFF"/>    //can change color
<stroke android:width="3dp"         //border color  
        android:color="#0FECFF" /><!-- #330000FF #ffffffff -->
<gradient          //add gradient depending on your need else you can remove this
    android:startColor="#ffffffff"  
    android:endColor="#110000FF" 
    android:angle="90"/> 

<padding android:left="5dp"
         android:top="5dp"
         android:right="5dp"
         android:bottom="5dp"/> 
<corners android:bottomRightRadius="7dp"//for rounded corners
         android:bottomLeftRadius="7dp" 
         android:topLeftRadius="7dp"
         android:topRightRadius="7dp"/> 
</shape>

I am not sure if its the same color as above. But working principle is the same