Board index » Android Coding Problems » Other Coding-Problems

Skip to content

How to change the background of GridView elements

Put your problem here if it does not fit any of the other categories.
Post a reply

How to change the background of GridView elements

Postby ftorte » Sun Feb 10, 2008 1:46 pm

Dear All,
I want to develop the same type of view we have in android for the slection of an application by using a gridview of linearlayouts. Each linear layour is composed of an image and a text.

XML code for the GridLayout

Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1. <?xml version="1.0" encoding="utf-8"?>
  2.  
  3. <GridView xmlns:android="http://schemas.android.com/apk/res/android"
  4.  
  5.    id="@+id/myGrid"
  6.  
  7.         android:layout_width="fill_parent"
  8.  
  9.         android:layout_height="fill_parent"  
  10.  
  11.    android:numColumns="3"
  12.  
  13.    android:gravity="center"
  14.  
  15. />
Parsed in 0.001 seconds, using GeSHi 1.0.8.4


XML code for the LinearLayout

Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1. <?xml version="1.0" encoding="UTF-8"?>
  2.  
  3. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  4.  
  5.         android:orientation="vertical"
  6.  
  7.         android:layout_width="fill_parent"
  8.  
  9.         android:layout_height="fill_parent">
  10.  
  11.        
  12.  
  13.         <ImageView id="@+id/image"
  14.  
  15.                 android:layout_width="fill_parent"
  16.  
  17.        android:layout_height="50px"  
  18.  
  19.        android:layout_marginTop="10px"
  20.  
  21.         android:layout_marginLeft="10px"
  22.  
  23.         android:layout_marginRight="10px"
  24.  
  25.         />
  26.  
  27.    
  28.  
  29.     <TextView id="@+id/imagetext"
  30.  
  31.        android:layout_width="wrap_content"
  32.  
  33.        android:layout_height="wrap_content"
  34.  
  35.        android:textSize="15px"/>    
  36.  
  37. </LinearLayout>
Parsed in 0.002 seconds, using GeSHi 1.0.8.4



Those XML are use by an activity that create a set of view and use an adapter to populate the gridview

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. public class SetupContent extends Activity {
  2.  
  3.        
  4.  
  5.         @Override    
  6.  
  7.         public void onCreate(Bundle icicle){
  8.  
  9.                 super.onCreate(icicle);        
  10.  
  11.                 setContentView(R.layout.imagegrid);        
  12.  
  13.                 GridView g = (GridView) findViewById(R.id.myGrid);
  14.  
  15.                 g.setAdapter(new ImageAdapter(this));
  16.  
  17.         }    
  18.  
  19.        
  20.  
  21.         public class CustomImageView extends LinearLayout
  22.  
  23.                 implements android.view.View.OnClickListener,android.view.View.OnFocusChangeListener{
  24.  
  25.                
  26.  
  27.                 public void onFocusChanged(View v, boolean focused) {
  28.  
  29.                         // TODO Auto-generated method stub
  30.  
  31.                         if(focused)
  32.  
  33.                                 this.setBackground(R.drawable.shape_1);
  34.  
  35.                         else
  36.  
  37.                                 this.setBackground(0x000000);
  38.  
  39.                 }
  40.  
  41.                 ImageView       image   =null;
  42.  
  43.                 TextView        label   =null;
  44.  
  45.                 View            theView =null;
  46.  
  47.                 int                     ID              =0;
  48.  
  49.                 public CustomImageView(Context context) {
  50.  
  51.                         super(context);
  52.  
  53.                         // TODO Auto-generated constructor stub
  54.  
  55.                        
  56.  
  57.                         ViewInflate inf =(ViewInflate)getSystemService(INFLATE_SERVICE);
  58.  
  59.                         theView = inf.inflate(R.layout.imageview, null, false, null);
  60.  
  61.                         image = (ImageView) theView.findViewById(R.id.image);    
  62.  
  63.                         label = (TextView) theView.findViewById(R.id.imagetext);    
  64.  
  65.  
  66.  
  67.                         label.setTypeface(Typeface.create("Tahoma", Typeface.BOLD));
  68.  
  69.  
  70.  
  71.                         addView(theView, new LinearLayout.LayoutParams(
  72.  
  73.                     LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT));
  74.  
  75.                        
  76.  
  77.                         setOnClickListener(this);
  78.  
  79.                         this.setOnFocusChangeListener(this);
  80.  
  81.                 }
  82.  
  83.                 @Override
  84.  
  85.                 public boolean onMotionEvent(MotionEvent event) {
  86.  
  87.                         performClick();
  88.  
  89.                         requestFocus();
  90.  
  91.                         return super.onMotionEvent(event);
  92.  
  93.                 }
  94.  
  95.                 public void onClick(View arg0) {
  96.  
  97.                         // TODO Auto-generated method stub
  98.  
  99.                         Log.i("IconTextMenuClicked", "clicked");
  100.  
  101.                         label.setText("xxx");
  102.  
  103.                         SetupContent(ID);
  104.  
  105.                         arg0.requestFocus();
  106.  
  107.                 }
  108.  
  109.                 public void setImageResource(int drawable)
  110.  
  111.                 {
  112.  
  113.                         image.setImageResource(drawable);
  114.  
  115.                 }
  116.  
  117.                 public void setImageLabel(String strLabel)
  118.  
  119.                 {
  120.  
  121.                         label.setText(strLabel);
  122.  
  123.                 }
  124.  
  125.                 public void setID(int nID)
  126.  
  127.                 {
  128.  
  129.                         ID=nID;
  130.  
  131.                 }
  132.  
  133.  
  134.  
  135.         }
  136.  
  137.        
  138.  
  139.         public class ImageAdapter extends BaseAdapter {        
  140.  
  141.                 private Integer[] mThumbIds = {                
  142.  
  143.                                 R.drawable.people_add32x32,
  144.  
  145.                                 R.drawable.appointmentnew32x32,                
  146.  
  147.                                 R.drawable.people32x32,
  148.  
  149.                                 R.drawable.people_add32x32,
  150.  
  151.                                 R.drawable.appointmentnew32x32,                
  152.  
  153.                                 R.drawable.people32x32,
  154.  
  155.                                 R.drawable.people_add32x32,
  156.  
  157.                                 R.drawable.appointmentnew32x32,                
  158.  
  159.                                 R.drawable.people32x32,
  160.  
  161.                                 R.drawable.people_add32x32,
  162.  
  163.                                 R.drawable.appointmentnew32x32,                
  164.  
  165.                                 R.drawable.people32x32,
  166.  
  167.                                 R.drawable.people_add32x32,
  168.  
  169.                                 R.drawable.appointmentnew32x32,                
  170.  
  171.                                 R.drawable.people32x32,
  172.  
  173.                                 R.drawable.people_add32x32,
  174.  
  175.                                 R.drawable.appointmentnew32x32,                
  176.  
  177.                                 R.drawable.people32x32,
  178.  
  179.                                 R.drawable.people_add32x32,
  180.  
  181.                                 R.drawable.appointmentnew32x32,                
  182.  
  183.                                 R.drawable.people32x32,
  184.  
  185.                                 R.drawable.people_add32x32,
  186.  
  187.                                 R.drawable.appointmentnew32x32,                
  188.  
  189.                                 R.drawable.people32x32,
  190.  
  191.                                 R.drawable.people_add32x32,
  192.  
  193.                                 R.drawable.appointmentnew32x32,                
  194.  
  195.                                 R.drawable.people32x32
  196.  
  197.                                
  198.  
  199.                 };
  200.  
  201.                 private String[] labels = {                
  202.  
  203.                                 "Contacts",
  204.  
  205.                                 "none...",
  206.  
  207.                                 "none...",             
  208.  
  209.                                 "Contacts",
  210.  
  211.                                 "none...",
  212.  
  213.                                 "none...",             
  214.  
  215.                                 "Contacts",
  216.  
  217.                                 "none...",
  218.  
  219.                                 "none...",             
  220.  
  221.                                 "Contacts",
  222.  
  223.                                 "none...",
  224.  
  225.                                 "none...",             
  226.  
  227.                                 "Contacts",
  228.  
  229.                                 "none...",
  230.  
  231.                                 "none...",             
  232.  
  233.                                 "Contacts",
  234.  
  235.                                 "none...",
  236.  
  237.                                 "none...",             
  238.  
  239.                                 "Contacts",
  240.  
  241.                                 "none...",
  242.  
  243.                                 "none...",             
  244.  
  245.                                 "Contacts",
  246.  
  247.                                 "none...",
  248.  
  249.                                 "none...",             
  250.  
  251.                                 "Contacts",
  252.  
  253.                                 "none...",
  254.  
  255.                                 "none..."              
  256.  
  257.        
  258.  
  259.                 };
  260.  
  261.                
  262.  
  263.                 public ImageAdapter(Context c) {            
  264.  
  265.                         mContext = c;        
  266.  
  267.                 }        
  268.  
  269.                 public int getCount(){            
  270.  
  271.                         return mThumbIds.length;        
  272.  
  273.                 }        
  274.  
  275.                 public Object getItem(int position){            
  276.  
  277.                         return position;        
  278.  
  279.                 }        
  280.  
  281.                 public long getItemId(int position){            
  282.  
  283.                         return position;        
  284.  
  285.                 }        
  286.  
  287.                 public View getView(int position, View convertView, ViewGroup parent) {
  288.  
  289.                         CustomImageView i = new CustomImageView(mContext);            
  290.  
  291.                         i.setImageResource(mThumbIds[position]);  
  292.  
  293.                         i.setID(position);
  294.  
  295.                         String label = "img" + position;
  296.  
  297.                         i.setImageLabel(label);
  298.  
  299.                         return i;      
  300.  
  301.                 }        
  302.  
  303.                 private Context mContext;    
  304.  
  305.         }
  306.  
  307.  
  308.  
  309.         void SetupContent(int ID)
  310.  
  311.         {
  312.  
  313.                 switch(ID){
  314.  
  315.                 case 0:
  316.  
  317.                         SetupContactContent();
  318.  
  319.                         break;
  320.  
  321.                 }
  322.  
  323.         }
  324.  
  325.        
  326.  
  327.         void SetupContactContent()
  328.  
  329.         {
  330.  
  331.        
  332.  
  333.         }
  334.  
  335.  
  336.  
  337. }
Parsed in 0.049 seconds, using GeSHi 1.0.8.4


I want that when I move the cursor arrow... or when I click on a icon the background change from black to a countour of type shape and the focus move to this cell. Instead of this i get:

If a move with the arrow keys the background remain the standard one (blu and big sqare).
If I clik the background dont change and the focus remain on the current cell, only the label is changed to xxx

here is the shape I want to use as background.

Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1. <?xml version="1.0" encoding="UTF-8"?>
  2.  
  3. <shape
  4.  
  5.         xmlns:android="http://schemas.android.com/apk/res/android">
  6.  
  7.     <solid android:color="#00000000"/>
  8.  
  9.     <stroke android:width="4dp" android:color="@color/butter_dark"/>
  10.  
  11.     <gradient
  12.  
  13.         android:startColor="#9297e9"
  14.  
  15.         android:endColor="#3742e9"
  16.  
  17.        android:angle="270"/>
  18.  
  19.         <padding android:left="1dp" android:top="1dp"
  20.  
  21.            android:right="1dp" android:bottom="1dp" />
  22.  
  23.         <corners android:radius="3dp" />  
  24.  
  25. </shape
Parsed in 0.002 seconds, using GeSHi 1.0.8.4
ftorte
Freshman
Freshman
 
Posts: 9
Joined: Thu Dec 27, 2007 4:15 pm
Location: Grenoble, France
Top
Top
Post a reply

Return to Other Coding-Problems

Who is online

Users browsing this forum: No registered users and 11 guests

Board index The team • Delete all board cookies • All times are UTC + 1 hour