How to set custom font for android listview?

Question

I am new to android and using custom font for listview.I did not know how to use the typeface in a list view .I also tried with different examples but cant solve my problem .Here is my code

public class HomeScreen extends ListActivity {
    private static final int QUICK_START_INDEX =0;
    private static final int CUSTOM = 1;
    private static final int CALL_LIST = 2;
    private static final int CALENDAR = 3;
    private static final int TEMPLATES=4;
    private static final int USER_GUIDE = 5;
    static final String[] LIST = 
               new String[] { "QuickStart", "Custom", "CallList", "Calendar","Templates","UserGuide"};

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setListAdapter(new MobileArrayAdapter(this, LIST));
   /*Typeface font = Typeface.createFromAsset(getAssets(), "earthkid.ttf");  */

    }

    @Override
    protected void onListItemClick(ListView l, View v, int position, long id) {

        //get selected items
        String selectedValue = (String) getListAdapter().getItem(position);
        /*Toast.makeText(this, selectedValue, Toast.LENGTH_SHORT).show();*/

        if(position==QUICK_START_INDEX){
            startActivity(new Intent(HomeScreen.this,ConfDialer.class));
        }

    }

}

MobileArrayAdapter.java

public class MobileArrayAdapter extends ArrayAdapter<String> {
    private final Context context;
    private final String[] values;

    public MobileArrayAdapter(Context context, String[] values) {
        super(context, R.layout.list_home, values);
        this.context = context;
        this.values = values;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        LayoutInflater inflater = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View rowView = inflater.inflate(R.layout.list_home, parent, false);
        TextView textView = (TextView) rowView.findViewById(R.id.label);

        ImageView imageView = (ImageView) rowView.findViewById(R.id.logo);
        textView.setText(values[position]);


        // Change icon based on name
        String s = values[position];

        System.out.println(s);

        if (s.equals("QuickStart")) {
            imageView.setImageResource(R.drawable.quick_strat);
        } else if (s.equals("Custom")) {
            imageView.setImageResource(R.drawable.customize);
        } else if (s.equals("CallList")) {
            imageView.setImageResource(R.drawable.call_list);
        } else if(s.equals("Calendar")){
            imageView.setImageResource(R.drawable.calendar);
        } else if(s.equals("Templates")){
            imageView.setImageResource(R.drawable.templates);
        }
        else{
            imageView.setImageResource(R.drawable.user_guide);
        }

        return rowView;
    }


}

Could any one provide solution for this.

Solution 1

Try this...

You can override the getView() when creating your Adapter in Activity, for example of a SimpleAdapter with name and title.

//global declaration
ListAdapter adapter;

adapter = SimpleAdapter(getActivity(), your_list, R.layout.your_list_items, new String[]{"Name", "Title"}, new int[]{R.id.name, R.id.title}){ 


@Override
 public View getView(int position,  View convertView, ViewGroup parent) {
           v = convertView;
     if(v == null){
     LayoutInflater li = (LayoutInflater)getActivity().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
     v = li.inflate(R.layout.interview_list_items, null);
     TextView titleText= (TextView) v.findViewById(R.id.title);
     TextView nameText= (TextView) v.findViewById(R.id.name);
     childFont = Typeface.createFromAsset(getActivity().getAssets(),"fonts/Roboto-Light.ttf");
     titleText.setTypeface(childFont);
    nameText.setTypeface(childFont);
    return super.getView(position, v, parent);  
    }                                   
};                      

Or try it in Adapter class like this...

public class MobileArrayAdapter extends ArrayAdapter<String> {
private final Context context;
private final String[] values;
private Typeface tf; 

public MobileArrayAdapter(Context context, String[] values) {
    super(context, R.layout.list_home, values);
    this.context = context;
    this.values = values;
    this.tf = Typeface.createFromAsset(context.getAssets(), "fonts/Roboto-Light.ttf"); //initialize typeface here.
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    LayoutInflater inflater = (LayoutInflater) context
        .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

    View rowView = inflater.inflate(R.layout.list_home, parent, false);
    TextView textView = (TextView) rowView.findViewById(R.id.label);

    ImageView imageView = (ImageView) rowView.findViewById(R.id.logo);
    textView.setTypeface(tf); // set typeface here
    textView.setText(values[position]);


    // Change icon based on name
    String s = values[position];

    System.out.println(s);

    if (s.equals("QuickStart")) {
        imageView.setImageResource(R.drawable.quick_strat);
    } else if (s.equals("Custom")) {
        imageView.setImageResource(R.drawable.customize);
    } else if (s.equals("CallList")) {
        imageView.setImageResource(R.drawable.call_list);
    } else if(s.equals("Calendar")){
        imageView.setImageResource(R.drawable.calendar);
    } else if(s.equals("Templates")){
        imageView.setImageResource(R.drawable.templates);
    }
    else{
        imageView.setImageResource(R.drawable.user_guide);
    }

    return rowView;
}

}

app directory structure

Solution 2

Put a custom font file .ttf in assets folder and use the below code to change font

text.setTypeface(Typeface.createFromAsset(getAssets(), "/*path to your font file */"));

Path would be the path in assets. If file is in assets folder only the use only the file name with extension.

Like

 text.setTypeface(Typeface.createFromAsset(getAssets(), "arial.ttf"));

Solution 3

use this code

In Your MobileArrayAdapter

class MobileArrayAdapter extends ArrayAdapter<CharSequence>{
            Typeface tf; 
        public MobileArrayAdapter(Context context, String[] values,String FONT) {
                tf = Typeface.createFromAsset(context.getAssets(), FONT);
            }

From Where You Are calling your adapter

listAdapter = new MobileArrayAdapter(this, R.layout.custom_list_text, R.array.arrayName, "name_of_font.ttf");

Solution 4

you just need to change the font in this layout "R.layout.list_home". Because list_home is layout which is working as a single row. So if you changes it, it will affects the color/text/style of listview too.

View more solutions

Comments

[ban-geoengineering]

Agreed. I think it's better to do your styling in your xml files rather than in your Java code. In the layout file, add android:fontFamily="@font/my_font" to the TextView. And ensure my_font.ttf (or whatever) is in your res/font/ folder.