Monday 10 September 2012

Multiple Views in Sinlge List with ListView and Other Control - Hotel Menu Example

In this Code We will use multiple Views in a single list as well as put a Button below the list which use to show how many items will be selected in another new Activities.



  1. First We will create the layout of each row as follows layout/rowlayout.xml.

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    	android:orientation="horizontal" android:layout_width="fill_parent"
    	android:layout_height="fill_parent">
    	
    	<ImageView android:layout_height="60px" 
    		android:id="@+id/imageView1"
    		android:layout_width="60px" 
    		android:src="@drawable/icon" 
    		android:maxWidth="5px"
    		android:minWidth="5px"
    		/>
    	<TextView android:text="TextView" 
    		android:layout_width="200dp"
    		android:layout_height="wrap_content" 
    		android:id="@+id/textView1"
    		android:lines="2"
    		android:layout_marginLeft="10px"
    		android:layout_marginTop="10px" 
    		android:textSize="15px"
    		></TextView>
    	<CheckBox android:text="" 
    	android:id="@+id/checkBox1" 
    	android:layout_width="wrap_content" 
    	android:layout_height="wrap_content" />
    	
    </LinearLayout>
    
  2. Than we create our main layout as follows layout/main.xml

    <?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_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:id="@android:id/list"
        />
      <Button android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:id="@+id/btnOrder" 
        android:text="Order" 
        android:layout_gravity="center"/>
    </LinearLayout>
    
    Here the name of the listView must be as aboves : "@android:id/list" where android list will be automatically placed when we add the adapter in our activity class.
  3. Then we create a class which extend the ArrayAdapter  class as follows.
     
    package com.container;
    
    import android.content.Context;
    import android.view.LayoutInflater;
    import android.view.View;
    
    import android.view.ViewGroup;
    import android.widget.ArrayAdapter;
    import android.widget.CheckBox;
    import android.widget.CompoundButton;
    import android.widget.CompoundButton.OnCheckedChangeListener;
    import android.widget.ImageView;
    import android.widget.TextView;
    
    import com.container.R;
    
    public class HotelMenuAdapter extends ArrayAdapter<String> {
    	Context context;
    	String[] values;
    	int position;
    	boolean itemSelected[] = { false, false, false, false, false, false };
    
    	public HotelMenuAdapter(Context context, String[] values) {
    		super(context, R.layout.rowlayout, values);
    		this.context = context;
    		this.values = values;
    	}
    
    	public View getView(final int positon, View convertView, ViewGroup parent) {
    		LayoutInflater inflater = (LayoutInflater) context
    				.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    		View rowView = inflater.inflate(R.layout.rowlayout, parent, false);
    
    		TextView textView = (TextView) rowView.findViewById(R.id.textView1);
    		ImageView image = (ImageView) rowView.findViewById(R.id.imageView1);
    		final CheckBox checkBox = (CheckBox) rowView
    				.findViewById(R.id.checkBox1);
    
    		image.setOnClickListener(new View.OnClickListener() {
    
    			public void onClick(View v) {
    				// TODO Auto-generated method stub
    				// Toast.makeText(context, ((TextView)v).getText().toString(),
    				// 5).show();
    				if (checkBox.isChecked()) {
    					checkBox.setChecked(false);
    					itemSelected[positon] = false;
    				} else {
    					checkBox.setChecked(true);
    					itemSelected[positon] = true;
    				}
    			}
    		});
    
    		textView.setOnClickListener(new View.OnClickListener() {
    
    			public void onClick(View v) {
    				// TODO Auto-generated method stub
    				// Toast.makeText(context, ((TextView)v).getText().toString(),
    				// 5).show();
    				if (checkBox.isChecked()) {
    					checkBox.setChecked(false);
    					itemSelected[positon] = false;
    				} else {
    					checkBox.setChecked(true);
    					itemSelected[positon] = true;
    				}
    			}
    		});
    
    		checkBox.setOnCheckedChangeListener(new OnCheckedChangeListener() {
    
    			public void onCheckedChanged(CompoundButton buttonView,
    					boolean isChecked) {
    				// TODO Auto-generated method stub
    				// Toast.makeText(context, String.valueOf(positon), 5).show();
    				if (isChecked) {
    					itemSelected[positon] = true;
    					// Toast.makeText(context, "Checked", 5).show();
    				} else {
    
    					itemSelected[positon] = false;
    					// Toast.makeText(context, "Not Checked", 5).show();
    				}
    
    			}
    		});
    
    		textView.setText(values[positon]);
    		switch (positon) {
    		case 0:
    			image.setImageResource(R.drawable.a);
    			break;
    		case 1:
    			image.setImageResource(R.drawable.b);
    			break;
    		case 2:
    			image.setImageResource(R.drawable.c);
    			break;
    		case 3:
    			image.setImageResource(R.drawable.d);
    			break;
    		case 4:
    			image.setImageResource(R.drawable.e);
    			break;
    		case 5:
    			image.setImageResource(R.drawable.f);
    			break;
    		case 6:
    			image.setImageResource(R.drawable.g);
    			break;
    
    		}
    
    		checkBox.setChecked(false);
    		return rowView;
    	}
    
    	public boolean[] getItemSelected() {
    		return itemSelected;
    	}
    
    	public void setItemSelected(boolean[] itemSelected) {
    		this.itemSelected = itemSelected;
    	}
    
    }
    
    In this class we also add the listeners for the ImageView, TextView as well as CheckBoxes.

  4. Then in our main Activity class we will extends the ListActivity class as follows.

    package com.container;
    
    import android.app.ListActivity;
    import android.content.Intent;
    import android.os.Bundle;
    import android.view.View;
    import android.widget.Button;
    import android.widget.CheckBox;
    import android.widget.Toast;
    
    public class HotelMenuDemoActivity extends ListActivity {
    	/** Called when the activity is first created. */
    	String[] values = { "McVeggie~Rs.40-50", "McAloo Tikki~Rs 20–50",
    			"Paneer Salsa~Rs 20–50", "Crispy Chinese~Rs 20–50",
    			"McCurry Pan~Rs 20–50", "Chicken Maharaja Mac", };
    	Button btnOrder;
    	CheckBox chBox;
    	HotelMenuAdapter menuAdapter;
    
    	
    	@Override
    	public void onCreate(Bundle savedInstanceState) {
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.main);
    		
    		menuAdapter = new HotelMenuAdapter(getApplicationContext(), values);
    		setListAdapter(menuAdapter);
    
    		btnOrder = (Button) findViewById(R.id.btnOrder);
    		btnOrder.setOnClickListener(new View.OnClickListener() {
    
    			public void onClick(View arg0) {
    				// TODO Auto-generated method stub
    				boolean [] selectedItem=menuAdapter.getItemSelected();
    				int count=0;
    				Intent intent=new Intent(getApplicationContext(),ShowOrderActivity.class);
    				for(int i=0;i<selectedItem.length;i++){
    					if(selectedItem[i]==true){
    						count++;
    						intent.putExtra("items",values);
    						intent.putExtra("selected",selectedItem);
    				//	Toast.makeText(getApplicationContext(), menuAdapter.getItem(i),5).show();
    					}
    				}
    				startActivity(intent);
    			}
    		});
    
    	}
    }


  5. Finally We will create the another activity which just show the items witch is selected. as follows. 

    package com.container;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.widget.TextView;
    
    public class ShowOrderActivity extends Activity {
    
    	/** Called when the activity is first created. */
    	@Override
    	public void onCreate(Bundle savedInstanceState) {
    		super.onCreate(savedInstanceState);
    
    		TextView tv = new TextView(this);
    		tv.setMaxLines(10);
    		Bundle b = getIntent().getExtras();
    		String order = "Your Order is : \n";
    		String[] values = (String[]) b.getSerializable("items");
    		boolean[] items = (boolean[]) b.getSerializable("selected");
    		if (items != null && values != null) {
    			for (int i = 0; i < values.length; i++) {
    				if (items[i] == true)
    					order += values[i] + ",\n";
    			}
    		}
    		tv.setText(order);
    		setContentView(tv);
    		// TODO Auto-generated method stub
    	}
    
    }
    
That's the code:
  • When you click on the ImageView,TextView or Checkbox  corresponding Checkbox will be checked or unchecked in reverse state.  as follows

  • After selecting which ever items you want click on "Order" Button than following  output will be displayed. 

Monday 3 September 2012

Android TabLayout example


In this example we have three tab as follows. you can move in the any tab at by clicking on the Tab. as follows

  1. First we design the XML layout as follows

    <?xml version="1.0" encoding="utf-8"?>
    <TabHost xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@android:id/tabhost" android:layout_width="match_parent"
     android:layout_height="match_parent">
     <LinearLayout android:id="@+id/linearLayout1"
      android:layout_width="match_parent" android:layout_height="match_parent"
      android:orientation="vertical">
      <TabWidget android:layout_width="match_parent"
       android:layout_height="wrap_content" 
       android:id="@android:id/tabs"></TabWidget>
      <FrameLayout android:layout_width="match_parent"
       android:layout_height="match_parent" android:id="@android:id/tabcontent">
       
      </FrameLayout>
     </LinearLayout>
    </TabHost>
    
    


  2.  Create the Activtity file for diffrent Tab Activities we have create three diffrent Activity : ActivityA, ActivityB, ActivityC as follows


  3. package com.container;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.widget.TextView;
    
    public class ActivityA extends Activity {
    
     /** Called when the activity is first created. */
     @Override
     public void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         TextView tv=new TextView(this);
         tv.setText("I am in Tab A..");
         setContentView(tv);
         // TODO Auto-generated method stub
     }
    
    }
    
    package com.container;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.widget.TextView;
    
    public class ActivityB extends Activity {
    
     /** Called when the activity is first created. */
     @Override
     public void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         TextView tv=new TextView(this);
         tv.setText("I am in Tab B..");
         setContentView(tv);
         // TODO Auto-generated method stub
     }
    
    }
    
    package com.container;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.widget.TextView;
    
    public class ActivityC extends Activity {
    
     /** Called when the activity is first created. */
     @Override
     public void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         TextView tv=new TextView(this);
         tv.setText("I am in Tab C..");
         setContentView(tv);
         // TODO Auto-generated method stub
     }
    
    }
    
  4. Than we Create Our main Activity as follows code..


  5. package com.container;
    
    import android.app.TabActivity;
    import android.content.Intent;
    import android.content.res.Resources;
    import android.os.Bundle;
    import android.widget.TabHost;
    
    public class TabViewDemoActivity extends TabActivity {
        /** Called when the activity is first created. */
     Resources res;
     TabHost tabHost;
     TabHost.TabSpec spec;
     Intent intent;
        @Override
        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.main);
            
            res=getResources();
            tabHost=getTabHost();
            
            /**Create Tab A**/
            intent=new Intent().setClass(this,ActivityA.class);
            spec=tabHost.newTabSpec("A")
              .setIndicator("A",res.getDrawable(R.drawable.ic_btn_speak_now))
              .setContent(intent);
            tabHost.addTab(spec);
            
            /**Create Tab B**/
            intent=new Intent().setClass(this,ActivityB.class);
            spec=tabHost.newTabSpec("B")
              .setIndicator("B",res.getDrawable(R.drawable.ic_btn_speak_now))
              .setContent(intent);
            tabHost.addTab(spec);
            
            /**Create Tab C**/
            intent=new Intent().setClass(this,ActivityC.class);
            spec=tabHost.newTabSpec("C")
              .setIndicator("C",res.getDrawable(R.drawable.ic_btn_speak_now))
              .setContent(intent);
            tabHost.addTab(spec);
        }
    }


that it, Run your app you can move on any Tab By clicking on that as follows