Creating custom android layout

Question

I am a new newbie to android. Just wanna know how could we create the UI layout as similar to the image attached below. I have knowledge of creating basic layouts, please guide me with some sample code examples or any references that might help me.

I have label in the left side of each row and Spinner at right side. The number of rows to be present on the screen is to be decided dynamically as per the server response. So i cannot hard code the complete view in XML.

Any kind of help on this is highly appreciated. Thanks in advance.

enter image description here

score 3 · Accepted Answer · answered Feb 13 '12 at 07:27

create your layouts as follows:

<LinearLayout android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout android:layout_width="fill_parent"
           android:layout_height="wrap_content"
           android:id="@+id/llTitle"
           android:background="#ffffff"
           android:gravity="center">
           <TextView android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:text="Title">
     </LinearLayout>
     <LinearLayout android:layout_width="fill_parent"
                   android:layout_height="fill_parent"
                   android:background="#FF00FF">
                   <LinearLayout android:layout_width="fill_parent"
                                 android:layout_height="wrap_content"
                                 android:background="@drawable/customshape"
                                 amdroid:id="@+id/llContainer"/>

                   <Button android:layout_width="wrap_content"
                           android:layout_height="wrap_content"
                           android:text="button"
                           android:id/button1"/>
             </LinearLayout>

     </LinearLayout>

customshape.xml:

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
     android:shape="rectangle"> 
     <gradient android:startColor="#SomeGradientBeginColor" android:endColor="#SomeGradientEndColor" 
            android:angle="270"/> 

    <corners android:bottomRightRadius="7dp" android:bottomLeftRadius="7dp" 
     android:topLeftRadius="7dp" android:topRightRadius="7dp"/> 
</shape>

row.xml //create rox.xml to contain a textview and a spinner.

in your activity loop to add views to llContainer

LinearLayout llContainer=(LinearLayout)findViewById(R.id.llContainer);
for(int i0;i<list.size();i++)
{
      LinearLayout llView=inflater.inflate(R.layout.row, null);
      //set attributes of textview and spinner
      llContainer.addView(llView);
}

score 1 · Answer 2 · answered Feb 13 '12 at 07:00

1

Better you take ListView, design your custom adapter having list item with Label and Spinner.

You just need to pass dynamic values (rows) to your custom adapter.

answered Feb 13 '12 at 07:00

Paresh Mayani

127,700
71
241
295

Sounds quite interesting. Any examples that i could get on that, which will make my life easy.?? – Nilanchala Feb 13 '12 at 07:03

score 0 · Answer 3 · edited May 23 '17 at 12:13

This is an example.Try to customize it

<?xml version="1.0" encoding="UTF-8"?>

http://schemas.android.com/apk/res/android" android:id="@+id/authnet_auth_buttons" android:layout_below="@id/authnet_error_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_marginTop="20dp">

<Button android:id="@+id/authnet_auth_cancel_button"
android:text="Cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/authnet_error_text"/>

<Button android:id="@+id/authnet_auth_login_button"
android:text="Login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/authnet_error_text"/>

enter image description here

For Values you have to use Spinner Widget

For Dynamic View see How to lay out Views in RelativeLayout programmatically?

@Sameer.. The number of rows to be present on the screen is to be decided dynamically as per the server response. So i cannot hard code the complete view in XML. — Nilanchala, Feb 13 '12 at 06:56
see this http://stackoverflow.com/questions/3909062/how-to-align-a-dynamically-create-userinterface-using-relativelayout-in-android for dynamic layouts — Tofeeq Ahmad, Feb 13 '12 at 07:06

Creating custom android layout

3 Answers3