image in the lisview

Put problem concerning Views, Layouts and other XML-Resources (like AndroidManifest) here.

image in the lisview

Postby nbagade » Wed Jan 20, 2010 4:29 pm

Hi all,

I want to display the images in Listview like,

one image on the right side of Listitem and second image in the left side of the next listitem.
again third image int right side of the next listitem and 4th image in left side of next listitem and continue..

Is any one has done the Listview like this.

Thanks in advance.

Narendra
nbagade
Experienced Developer
Experienced Developer
 
Posts: 58
Joined: Fri Nov 20, 2009 7:49 am
Location: India

Top

Postby Skeniver » Thu Jan 21, 2010 3:03 pm

Hi there

This code is not complete, I have cut and hacked it out of some of my code, so it won't copy and paste, but should cover what you are looking for...

Here is the xml for a ListView item:
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2. <?xml version="1.0" encoding="utf-8"?>
  3.  
  4. <RelativeLayout
  5.  
  6.         xmlns:android="http://schemas.android.com/apk/res/android"
  7.  
  8.         android:layout_width="wrap_content"
  9.  
  10.         android:layout_height="wrap_content">
  11.  
  12.         <TextView
  13.  
  14.                 android:id="@+id/ListProductName"
  15.  
  16.                 android:layout_width="wrap_content"
  17.  
  18.                 android:layout_height="wrap_content"
  19.  
  20.                 android:layout_toLeftOf="@+id/ListProductImage"
  21.  
  22.                 android:maxLines="2"
  23.  
  24.                 android:textSize="13dp"
  25.  
  26.                 android:textStyle="bold">
  27.  
  28.         </TextView>
  29.  
  30.         <ImageView
  31.  
  32.                 android:id="@+id/ListProductChoice"
  33.  
  34.                 android:layout_width="wrap_content"
  35.  
  36.                 android:layout_height="wrap_content"
  37.  
  38.                 android:layout_below="@+id/ListProductName"
  39.  
  40.                 android:layout_toRightOf="@+id/ListStar5"
  41.  
  42.                 android:src="@drawable/editors"
  43.  
  44.                 android:paddingLeft="3dp">
  45.  
  46.         </ImageView>
  47.  
  48. </RelativeLayout>
  49.  
  50.  
Parsed in 0.003 seconds, using GeSHi 1.0.8.4


And here is a listview shown on which ever view you want to show it on:
Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1.  
  2. <ListView
  3.  
  4.         android:id="@+id/HomeListView"
  5.  
  6.         android:layout_width="fill_parent"
  7.  
  8.         android:layout_height="wrap_content"
  9.  
  10.         android:layout_below="@+id/HomeLine2">
  11.  
  12. </ListView>
  13.  
  14.  
Parsed in 0.001 seconds, using GeSHi 1.0.8.4


You then need to extend an ArrayAdapter to handle the listview item:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2. public class ProductAdapter extends ArrayAdapter<String> {
  3.  
  4.         int resource;
  5.  
  6.        
  7.  
  8.         public ProductAdapter(Context _cont, int _resource, List<String> _items) {
  9.  
  10.                 super (_cont, _resource, _items);
  11.  
  12.                 resource = _resource;
  13.  
  14.         }
  15.  
  16.        
  17.  
  18.         @Override
  19.  
  20.         public View getView(int position, View convertView, ViewGroup parent) {
  21.  
  22.                 RelativeLayout rl;
  23.  
  24.                
  25.  
  26.                 String prod = getItem(position);
  27.  
  28.                 if (convertView == null) {
  29.  
  30.                         rl = new RelativeLayout(getContext());
  31.  
  32.                         LayoutInflater vi = (LayoutInflater)getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
  33.  
  34.                         vi.inflate(resource, rl, true);
  35.  
  36.                 } else {
  37.  
  38.                         rl = (RelativeLayout)convertView;
  39.  
  40.                 }
  41.  
  42.                 //SET THE NAME
  43.  
  44.                 TextView tv = (TextView)rl.findViewById(R.id.ListProductName);
  45.  
  46.                 tv.setText(prod.name);
  47.  
  48.                
  49.  
  50.                 return rl;
  51.  
  52.         }
  53.  
  54. }
Parsed in 0.033 seconds, using GeSHi 1.0.8.4


And then populate the adapter:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2. List<String> products = new ArrayList<String>();
  3.  
  4. ProductAdapter adapter;
  5.  
  6. ListView listProducts;
  7.  
  8.  
  9.  
  10. adapter = new ProductAdapter(cont, R.layout.list_product, products);
  11.  
  12. listProducts = (ListView)findViewById(R.id.HomeListView);
  13.  
  14. listProducts.setAdapter(adapter);
  15.  
  16. adapter.notifyDataSetChanged();
  17.  
  18.  
Parsed in 0.032 seconds, using GeSHi 1.0.8.4


As for staggering the images, you could make a custom class and store the images left or right according to how the items are added to the object... You would change the ArrayList<*CUSTOM CLASS TYPE*>

I hope this makes sense... It does so in my head...

Neil
Follow me on twitter -> http://twitter.com/Skeniver
Apps & blog -> http://www.formidableapps.co.uk
User avatar
Skeniver
Senior Developer
Senior Developer
 
Posts: 106
Joined: Tue Feb 03, 2009 3:51 pm
Location: Canterbury, UK

Postby SamB09 » Thu Jan 21, 2010 5:31 pm

hmm im a bit confused.. so array adapter should be in its own class?
Im not sure how to modify my code to be like your example. Listview is my custom list view element . I have no idea what your adapter class is doing thought...(trying to add button to list view) :( .
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.  
  2.  
  3.  
  4. public class SatMain extends Activity {
  5.  
  6.     /** Called when the activity is first created. */
  7.  
  8.         ArrayList<String> results = new ArrayList<String>();
  9.  
  10.         @Override
  11.  
  12.     public void onCreate(Bundle savedInstanceState)
  13.  
  14.     {
  15.  
  16.         super.onCreate(savedInstanceState);
  17.  
  18.         setContentView(R.layout.main);
  19.  
  20.         dbAdapter db = new dbAdapter(this);
  21.  
  22.         ListView listview;
  23.  
  24.          Button Button1;
  25.  
  26.          Button Button2;
  27.  
  28.  
  29.  
  30.  
  31.  
  32.          Button1= (Button)findViewById(R.id.btn1);
  33.  
  34.          Button2= (Button)findViewById(R.id.btn2);
  35.  
  36.          Button2= (Button)findViewById(R.id.btn3);
  37.  
  38.  
  39.  
  40.          Button1.setOnClickListener(new OnClickListener() {  
  41.  
  42.              
  43.  
  44.            
  45.  
  46.  
  47.  
  48.                         public void onClick(View v) {
  49.  
  50.                                
  51.  
  52.                                         Toast.makeText(getBaseContext(), "First Button Pressed",
  53.  
  54.                                         1000); }});
  55.  
  56.                                        
  57.  
  58.  
  59.  
  60.  
  61.  
  62.         //---get all titles---
  63.  
  64.         db.open();
  65.  
  66.           db.InsertData();
  67.  
  68.        
  69.  
  70.         Cursor c =  db.getSat1();
  71.  
  72.      
  73.  
  74.         if (c.moveToFirst())
  75.  
  76.         {
  77.  
  78.             do {          
  79.  
  80.                // String title =  c.getString(c.getColumnIndex(db.KEY_publisher));
  81.  
  82.                  String pub =  c.getString(c.getColumnIndex(db.KEY_Artist));
  83.  
  84.                  String pub1 =  c.getString(c.getColumnIndex(db.KEY_Time));
  85.  
  86.  
  87.  
  88.              //String col2 =  c.getString(1);
  89.  
  90.             //String col3 =  c.getString(2);
  91.  
  92.             //String col4 =  c.getString(3);
  93.  
  94.  
  95.  
  96.  
  97.  
  98.               results.add(pub + pub1 );
  99.  
  100.             } while (c.moveToNext());
  101.  
  102.         }
  103.  
  104.         db.close();
  105.  
  106.        
  107.  
  108.         listview = (ListView)findViewById(R.id.list);
  109.  
  110.        
  111.  
  112.        
  113.  
  114.         listview.setAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1,results));
  115.  
  116.  
  117.  
  118.        
  119.  
  120.            
  121.  
  122.                                      
  123.  
  124.                
  125.  
  126.     }}
  127.  
  128.        
Parsed in 0.041 seconds, using GeSHi 1.0.8.4
SamB09
Developer
Developer
 
Posts: 39
Joined: Tue Oct 27, 2009 9:22 pm
Location: England

Postby Skeniver » Thu Jan 21, 2010 5:41 pm

Heh heh, I can see how I was confusing... I will try a bit better here.

The custom listview item (the top XML snippet) is a layout file on its own, called list_product.xml. Which is what gets displayed in the actual listview. So each item in the listview will have a TextView and an ImageView.

The adapter IS a class on its own, called ProductAdapter (the app I use this in shows 'Products'). The adapter is the link between the ArrayList and the ListView. For each item in the ListView the getView method is called, which populates another list_product.

The bottom snippet of java code is how to populate the adapter. I have a List<String> of products (which has previously been populated). I create the adapter, using the list_product as the _resource and the List<String> as the _items. Then I find the ListView that I want to add them to and set it's adapter to the ProductAdapter I made. adapter.notifyDataSetChanged() tells the adapter that the data has changed and it must repopulate the ListView

Does that make sense?
Follow me on twitter -> http://twitter.com/Skeniver
Apps & blog -> http://www.formidableapps.co.uk
User avatar
Skeniver
Senior Developer
Senior Developer
 
Posts: 106
Joined: Tue Feb 03, 2009 3:51 pm
Location: Canterbury, UK

Postby SamB09 » Thu Jan 21, 2010 5:42 pm

Ah ok that seems alot better. I'll try that later thanks .
SamB09
Developer
Developer
 
Posts: 39
Joined: Tue Oct 27, 2009 9:22 pm
Location: England

Postby Skeniver » Thu Jan 21, 2010 5:45 pm

Hahaha, good luck!
Follow me on twitter -> http://twitter.com/Skeniver
Apps & blog -> http://www.formidableapps.co.uk
User avatar
Skeniver
Senior Developer
Senior Developer
 
Posts: 106
Joined: Tue Feb 03, 2009 3:51 pm
Location: Canterbury, UK

Top

Postby SamB09 » Thu Jan 21, 2010 6:24 pm

If its not any trouble could you post an image of what your code produces just to make sure im on the right track.
Thanks
SamB09
Developer
Developer
 
Posts: 39
Joined: Tue Oct 27, 2009 9:22 pm
Location: England

Top

Return to View, Layout & Resource Problems

Who is online

Users browsing this forum: Google Feedfetcher and 6 guests