want to use my own layout at ArrayAdapter - android

I use the following code to use the ArrayAdapter for my ListView:
ArrayList<String> mylist = new ArrayList<String>();
String xml = ParseXMLMethods.getXML();
Document doc = ParseXMLMethods.XMLfromString(xml);
NodeList children = doc.getElementsByTagName(KEY_ITEM);
for (int i = 0; i < children.getLength(); i++) {
Element e = (Element)children.item(i);
mylist.add(ParseXMLMethods.getValue(e, KEY_TITLE));
mylist.add(ParseXMLMethods.getValue(e, KEY_CITY));
mylist.add(ParseXMLMethods.getValue(e, KEY_COUNT));
}
adapter1=new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1,
mylist);
list2.setAdapter(adapter1);
Here I am able to see only Title, but I want to see all three in my listView Row.For this I create another layout R.layout.list_layout2 as follows:
My layout
<?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="50dp"
android:paddingLeft="6dp"
>
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:padding="1dp"
android:textSize="16dp"
android:textStyle="bold"
/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/subtitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="1dp"
android:textSize="12dp"
android:textColor="#000000" />
<TextView
android:id="#+id/subtitle2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:textSize="12dp"
android:textColor="#000000"
android:layout_toRightOf="#+id/subtitle" />
</RelativeLayout>
</LinearLayout>
How can I use this layout?

You're going to want to look at a Custom ListView Adapter. Note that your original code uses a custom ListView but not the Adapter. You're going to want to create your own Adapter that extends ArrayAdapter since your ListView row is more complex than just one TextView.
See Tutorial and enter link description here.
Ex:
list_row.xml
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TableRow>
<ImageView
android:id="#+id/img"
android:layout_width="50dp"
android:layout_height="50dp"/>
<TextView
android:id="#+id/txt"
android:layout_width="wrap_content"
android:layout_height="50dp" />
</TableRow>
</TableLayout>
CustomList.java
public class CustomList extends ArrayAdapter<String>{
private final Activity context;
private final String[] web;
private final Integer[] imageId;
public CustomList(Activity context, String[] web, Integer[] imageId) {
super(context, R.layout.list_single, web);
this.context = context;
this.web = web;
this.imageId = imageId;
}
#Override
public View getView(int position, View view, ViewGroup parent) {
LayoutInflater inflater = context.getLayoutInflater();
View rowView= inflater.inflate(R.layout.list_row, null, true);
TextView txtTitle = (TextView) rowView.findViewById(R.id.txt);
ImageView imageView = (ImageView) rowView.findViewById(R.id.img);
txtTitle.setText(web[position]);
imageView.setImageResource(imageId[position]);
return rowView;
}
}
In the example above, you're going to want to switch out the ImageView and replace it with your TextViews.

Related

How to put titles for each field of a ListView item in Android

I have a Listview with a custom adapter , which displays person's data like
Barak Obama 2008
But I want to put a header with Name Surname Date but properly alligned
A draft example:
ListView Items with titles
How Can I achieve this?
thank you
Custom ListView, All what you need, A xml layout for row with adapter and listview
check out this link explain Custom listview
https://github.com/codepath/android_guides/wiki/Using-an-ArrayAdapter-with-ListView
You can use TableLayout to show your Data as your requirement. I've replicated your demand. Here are the codes.
1) MainActivity.java
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ListView lstview=(ListView)findViewById(R.id.listView);
// Inflate header view
ViewGroup headerView = (ViewGroup)getLayoutInflater().inflate(R.layout.header_layout, lstview,false);
// Add header view to the ListView
lstview.addHeaderView(headerView);
// Get the string array defined in strings.xml file
String[] date = {"29-03-17", "29-03-17"};
String[] amount = {"5", "2"};
String[] dept = {"14", "4"};
// Create an adapter to bind data to the ListView
CustomListViewAdapter adapter=new CustomListViewAdapter(this,R.layout.row_listview, R.id.tvDate, date, amount, dept);
// Bind data to the ListView
lstview.setAdapter(adapter);
}
2) CustomListViewAdapter.java
public class CustomListViewAdapter extends ArrayAdapter<String> {
int groupid;
String[] date;
String[] amount;
String[] dept;
ArrayList<String> desc;
Context context;
public CustomListViewAdapter(Context context, int vg, int id, String[] date, String[] amount, String[] dept){
super(context,vg, id, date);
this.context=context;
groupid=vg;
this.date=date;
this.amount=amount;
this.dept=dept;
}
// Hold views of the ListView to improve its scrolling performance
static class ViewHolder {
public TextView tvDate;
public TextView tvAmount;
public TextView tvDept;
}
public View getView(int position, View convertView, ViewGroup parent) {
View rowView = convertView;
// Inflate the rowlayout.xml file if convertView is null
if(rowView==null){
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
rowView= inflater.inflate(groupid, parent, false);
ViewHolder viewHolder = new ViewHolder();
viewHolder.tvDate= (TextView) rowView.findViewById(R.id.tvDate);
viewHolder.tvAmount= (TextView) rowView.findViewById(R.id.tvAmount);
viewHolder.tvDept= (TextView) rowView.findViewById(R.id.tvDept);
rowView.setTag(viewHolder);
}
// Set text to each TextView of ListView item
ViewHolder holder = (ViewHolder) rowView.getTag();
holder.tvDate.setText(date[position]);
holder.tvAmount.setText(amount[position]);
holder.tvDept.setText(dept[position]);
return rowView;
}
}
3) HeaderLayout (header_layout.xml)
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="*"
>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/tvDate"
android:layout_column="0"
android:padding="10sp"
android:gravity="left"
android:layout_span="1"
android:text="Date"
android:layout_gravity="center">
</TextView>
<TextView
android:id="#+id/tvAmount"
android:layout_column="1"
android:padding="10sp"
android:gravity="left"
android:layout_span="1"
android:text="Amount"
android:layout_gravity="center">
</TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tvDept"
android:layout_column="2"
android:layout_span="1"
android:text="Dept"
android:layout_gravity="center" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tvDelete"
android:layout_column="3"
android:layout_span="1"
android:text="Delete"
android:layout_gravity="center" />
</TableRow>
</TableLayout>
4) RowLayout for each ListView row (row_listview.xml)
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="*">
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/tvDate"
android:layout_column="0"
android:padding="10sp"
android:gravity="left"
android:layout_span="1"
android:text="Date"
android:layout_gravity="center">
</TextView>
<TextView
android:id="#+id/tvAmount"
android:layout_column="1"
android:padding="10sp"
android:gravity="left"
android:layout_span="1"
android:text="Amount"
android:layout_gravity="center">
</TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tvDept"
android:layout_column="2"
android:layout_span="1"
android:text="Dept"
android:layout_gravity="center" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageButton"
android:layout_column="3"
android:layout_span="1"
android:src="#android:drawable/ic_delete" />
</TableRow>
</TableLayout>
5) Output:
Hope this helps.

Android ListView - Use Whole Row

I have a custom listview with the following layout (list_single.xml):
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent" >
<TableRow android:layout_width="fill_parent">
<ImageView
android:id="#+id/img"
android:layout_width="64dp"
android:layout_height="64dp"/>
<TextView
android:id="#+id/txt"
android:textSize="24dp" android:textStyle="bold"
android:paddingTop="20dp" android:paddingLeft="10dp"
android:layout_width="fill_parent"
android:layout_height="64dp" />
</TableRow>
</TableLayout>
Then i have a CustomList extender class that is assigning this layout:
public class CustomList extends ArrayAdapter<String> {
private final Activity context;
private final String[] web;
private final Integer[] imageId;
public CustomList(Activity context,
String[] web, Integer[] imageId) {
super(context, R.layout.list_single, web);
this.context = context;
this.web = web;
this.imageId = imageId;
}
#Override
public View getView(int position, View view, ViewGroup parent) {
LayoutInflater inflater = context.getLayoutInflater();
View rowView= inflater.inflate(R.layout.list_single, null, true);
TextView txtTitle = (TextView) rowView.findViewById(R.id.txt);
ImageView imageView = (ImageView) rowView.findViewById(R.id.img);
txtTitle.setText(web[position]);
imageView.setImageResource(imageId[position]);
return rowView;
}
}
Then inside the OnCreate event handler i add a listener:
list.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
However the only clickable area in the row is the icon though i want the whole row to be clickable. I checked some other similar questions here but i couldn't find solution for the TableLayout.
Thank you so much
you should set
android:focusableInTouchMode="true"
android:focusable="true"
in your table layout. Generally its not a good idea to use table layout n row layout of listview. For your case, you could easily do that by any other layout e.g. linearlayout,relativelayout etc
Following yours suggestions i replaced Table with Relative layout and now everything works as expected. Thank you so much guys. It's much appreciated.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/img"
android:layout_width="64dp"
android:layout_height="64dp" android:paddingLeft="20dp" />
<TextView
android:id="#+id/txt"
android:textSize="24dp"
android:textStyle="bold"
android:paddingTop="20dp"
android:paddingLeft="84dp"
android:layout_width="fill_parent"
android:layout_height="64dp" />
</RelativeLayout>
Sorry for not being able to vote (it requires minimum 15 points which i do not have as i am n00b) THANK You so much for the help. It's much appreciated.

Set different icons for each row

Above is the main screen of my app with a custom adapter for listview. How do I put a different icon for each row in the listview? I tried putting an ImageView in the xml but it overwrites my whole screen only showing an icon.
MainAcitivty xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/hp_color"
tools:context=".MainActivity" >
<TextView
android:id="#+id/cityText"
style="?android:attr/textAppearanceMedium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:textSize="28sp" />
<ImageView
android:id="#+id/condIcon"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_alignParentLeft="true"
android:layout_below="#id/cityText"
android:contentDescription="weather icon" />
<TextView
android:id="#+id/condDescr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/condIcon"
android:textSize="20sp" />
<ListView
android:id="#+id/mainListView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" />
<ImageButton
android:id="#+id/btnPicturePage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:onClick="picturePage"
android:src="#drawable/photo" />
Custom adapter:
public class WeatherAdapter extends ArrayAdapter<String> {
private final Activity context;
private ArrayList<String> weatherData;
static class ViewHolder {
public TextView text;
public ImageView image;
}
public WeatherAdapter(Activity context, ArrayList<String> weatherData) {
super(context, R.layout.list, weatherData);
this.context = context;
this.weatherData = weatherData;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View rowView = convertView;
// reuse views
if (rowView == null) {
LayoutInflater inflater = context.getLayoutInflater();
rowView = inflater.inflate(R.layout.list, null);
// configure view holder
ViewHolder viewHolder = new ViewHolder();
viewHolder.text = (TextView) rowView.findViewById(R.id.rowTextView);
rowView.setTag(viewHolder);
}
ViewHolder holder = (ViewHolder) rowView.getTag();
ArrayList<String> s = new ArrayList<String>(weatherData);
String []sa = new String [s.size()];
sa = s.toArray(sa);
holder.text.setText(sa[position]);
if (sa[position].startsWith("Air pressure")) {
rowView.setBackgroundResource(R.color.skyblue) ;
}
return rowView;
}
List xml
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rowTextView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:textSize="16sp"
android:textColor="#color/white" >
</TextView>
Your list.xml should be something similar to this (taken from one my files)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:gravity="center_vertical" android:orientation="horizontal"
android:background="#drawable/xml_pressed_bg" android:clickable="true" android:layout_width="fill_parent"
android:layout_height="54dip"
xmlns:android="http://schemas.android.com/apk/res/android" xmlns:ttshow="http://schemas.android.com/apk/res-auto">
<ImageView android:id="#+id/imgThumb" android:layout_width="42.0dip" android:layout_height="42.0dip" android:scaleType="fitXY"
android:src="#drawable/sample_dj" />
<TextView android:textSize="14.0sp" android:textColor="#ff666666" android:id="#+id/txtName"
android:layout_width="180dip" android:layout_height="wrap_content"
android:singleLine="true" android:shadowColor="#99ffffff" style="#style/TextShadowLight"
android:text="Hello" android:paddingLeft="10dip"/>
</LinearLayout>
Every row item has an image (imgThumb). This needs to be changed or set to a static image, depending on your needs. This is done in the adapters' getView() method.
imgThumb.setImageResource(R.drawable.my_image);
Private TypedArray img;
img=getResource.obtainTypedArray(R.array.imgIcon)
if (sa[position].startsWith("Air pressure")) {
rowView.setBackgroundResource(R.color.skyblue) ;
holder.image.setImageResource(img.gerResourceId[0]);
}else if (sa[position].startsWith("Air Condition")) {
holder.image.setImageResource(img.gerResourceId[1]);
}

Populating a multicolumn listview without a hashmap

I have been reading about multicolumn listviews today. They seem to be what I need, but can't info info about how to populate them not using a hash map. All examples I have seen use a hash map to build the listview data adapter but this is too heavy when lot of data is implied. Is there anyway to populate a list view without a hash list?
All examples I have seen use something like this:
http://saigeethamn.blogspot.com.es/2010/04/custom-listview-android-developer.html
Yes it is possible. please Check out the code.
public class List_view_ArrayAdapter extends ArrayAdapter<String> {
private Context context;
private String[] name;
private String[] address;
private String[] rating;
private TextView nameTextView;
private TextView addressTextView;
private ImageView lisiconImageView;
private AppManagers appManagers;
public List_view_ArrayAdapter(Context context, String[] name,
String[] address, String[] rating) {
super(context, R.layout.list_layout, name);
this.context = context;
this.name = name;
this.address = address;
this.rating = rating;
appManagers = new AppManagers();
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View rowView = inflater.inflate(R.layout.list_layout, parent, false);
nameTextView = (TextView) rowView.findViewById(R.id.nameTextView);
addressTextView = (TextView) rowView.findViewById(R.id.addressTextView);
lisiconImageView = (ImageView) rowView
.findViewById(R.id.listiconImageView);
nameTextView.setText(name[position]);
addressTextView.setText(address[position]);
lisiconImageView.setImageDrawable(appManagers
.ImageOperations(rating[position]));
// imageView.setImageResource(imageid[position]);
return rowView;
}
}
Here is list_layout for this line "R.layout.list_layout"
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" android:background="#d9d9d9">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" android:layout_marginBottom="5dp" android:layout_marginTop="5dp">
<ImageView
android:id="#+id/listiconImageView"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" android:layout_marginLeft="5dp" android:gravity="center_vertical" android:layout_marginBottom="5dp" android:layout_marginTop="5dp">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name : "
android:textColor="#2a170e" />
<TextView
android:id="#+id/nameTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textColor="#2a170e" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Address : "
android:textColor="#2a170e" />
<TextView
android:id="#+id/addressTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textColor="#2a170e" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Finaly you call it from your main Activity.
new List_view_ArrayAdapter arrayAdapter= new List_view_ArrayAdapter(context, appManagers.getNameArray(cafeandbarsList), name, address, rating);
listView.setAdapter(arrayAdapter);
I think it help you.
Thanks

Android EditText: How to process data

I have created an application which is a simple form. Users will enter username data and password into each editText pair provided.
My problem comes with extracting this data. Normally, I would extract by the "#id/" value assigned to each editText, but as I am using an adapter and a separate xml file for the row this is not possible, as each editText has the same id.
Does anyone have an idea how I might go about doing this?
Main.xml
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<Button
android:id="#+id/cancelbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cancel"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:paddingLeft="50dp"
android:paddingRight="50dp"/>
<Button
android:id="#+id/submitbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/submit"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:paddingLeft="50dp"
android:paddingRight="50dp"/>
<ListView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/list"
android:layout_alignParentTop="true"
android:layout_above="#id/cancelbutton" />
list.xml : used for individual row
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/logo"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
android:src="#drawable/g" >
</ImageView>
<EditText
android:id="#+id/firstLine"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="email"
>
</EditText>
<EditText
android:id="#+id/secondLine"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_alignRight="#id/logo"
android:layout_alignParentRight="true"
android:layout_below="#id/firstLine"
android:text="password"
>
</EditText>
public class ColorAdapter extends ArrayAdapter<String> {
private final Context context;
private final String[] values;
public SocialSiteAdapter(Context context, String[] values) {
super(context, R.layout.list, values);
this.context = context;
this.values = values;
}
// GetView does what exactly..?
#Override
public View getView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View rowView = inflater.inflate(R.layout.list, parent, false);
ImageView imageView = (ImageView) rowView.findViewById(R.id.logo);
// Change icon based on name
String s = values[position];
System.out.println(s);
if (s.equals("Blue")) {
imageView.setImageResource(R.drawable.b);
} else if (s.equals("Green")) {
imageView.setImageResource(R.drawable.g);
} else if (s.equals("Red")) {
imageView.setImageResource(R.drawable.r);
} else if (s.equals("Yellow")) {
imageView.setImageResource(R.drawable.y);
} else {
imageView.setImageResource(R.drawable.ic_launcher);
}
return rowView;
}
}
You need to first select the row and then inside the row select the EditTexts by their known #id
To list the entries you could go like:
ListView listView = getListView();
for (int i = 0; i < listView.getCount(); i++) {
Layout row = (Layout) listView.getItemAtPosition(i); /// XXX
EditText t = (EditText) row.findViewById(R.id.firstLine);
// ...
}
You need to check by yourself in the line with XXX what the getItem.. call returns and change accordingly.

Categories

Resources