Skip to main content

Adding custom view to xml

You wanted to write your own custom view. You wrote it extending View class or better still TextView or ImageView class. You even added this view within your activity using Java code and tested it successfully.

But adding views with Java is a lengthy process and is cumbersome. xml makes the process easier. 

So how do you add your custom view into your layout xml file?

somelayout.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">  
 <!--  Other Views -->  
     <com.some.name.CustomView  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"  
       android:id="@+id/cell1"/>  
 <!--  Other Views -->  
 </LinearLayout>  

OK, this is how you add your view in the xml file. Please note the fully qualified class name of custom view - including the package name. 

After this your activity  some times gives an error - error inflating the file. Why?

Two things you need to keep in mind.

  1.  You need at least two constructors for your customview class.  One with Context as parameter. And second with Context and AttributeSet as parameters. You need both the constructors even if you do not use any custom attributes for your class
  2. Both these constructors should be public.
e.g.
  class MyCustomView extends ImageView  
 {  
 /**some code here ****/  
 public MyCustomView(Context ctx)  
 {  
  /* your code **/  
 }  
 public MyCustomView(Context ctx, AttributeSet attrs)  
 {  
 /** code **/  
 }  }

Now your View will be available in the activity. 

Note : My experience has been, the more code you leave to the library, better for you. Specifically measurements and layouts. 

 

Comments

Popular posts from this blog

Simple ListView Adapter and list item select

When you are using a listview in your applications many a times you will write your own adapter to display item. But if your list is very simple showing a list of strings, you can use inbuilt adapters like ArrayAdapter, SimpleCursorAdapter etc.

ArrayAdapterLet us look at an example

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <ListView android:layout_height="wrap_content" android:id="@+id/listView1" android:layout_width="match_parent" android:layout_margin="20dp"> </ListView> </LinearLayout>

And add these lines to the onCreate method of the activity.

super.onCreate(savedInstanceState); …

Drawables in Android - Layer drawable

Let us see how to use layer drawable. You can have two or more bitmaps on different layers to create such a drawable

Using xml:

You should use layer-list in your xml file to create layerdrawable. Here is layer.xml
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <bitmap android:src="@drawable/whiteicon" android:gravity="top|left"/> </item> <item> <bitmap android:src="@drawable/blueicon" android:gravity="top|left"/> </item> <item> <bitmap android:src="@drawable/redicon" android:gravity="top|left"/> </item> </layer-list>
We are using three different bitmaps whiteicon.png, redicon.png and blueicon.png which are present in /res/drawable/mdpi folder. All these are of different sizes and aligned to top left. This drawab…

DatePickers in Android

DatePicker is a view which lets the user select a date showing a calendar or 3 spinners for dd, mm and yy.

Let us see how to use this.
Easy Method: To use a DatePicker you can use DatePickerDialog. This can be created and shown programmatically too.

publicvoidonCreate(Bundle b){/*********/ Button btn =(Button)findViewById(R.id.btn); btn.setOnClickListener(new View.OnClickListener(){@OverridepublicvoidonClick(View v){ showPickerDialog();}});}privatevoidshowPickerDialog(){ DatePickerDialog dtPickerDlg =new DatePickerDialog(this,this, 2017,10,20); dtPickerDialog.show();}

In our xml file, let us have a button and in the onclick listener of the button, let us display the date picker dialog - we call showPickerDialog.

In showPickerDialog,  we are using a random date to initialize.

The first  parameter is the context. Second parameter is the class which implements the interface OnDateSetListener. Next three parameters are year, month (Jan is 0) and …