Android: Is GridLayout is suitable for this design - android

In my application, I have to show some persons information. I have to show only three members at a time. On Swipe left to right i have to show another three set of members. Here is the design
First I thought , we can use three List Views namely LV1,LV2,LV3
and set a List adapter for these 3 listviews. And In the ListAdapter the first row of the listview can take the Title details and afterwards it takes an Listviews for the successive rows. i.e Every White box has individual Listview we cant predict how many white boxes exists for one member.
I can send one object called Member for one listView and One of the attributes of the member object is ArrayList
ie
List mem1 = new ArrayList();
mem1.add(member1)
List mem2 = new ArrayList();
mem2.add(member2)
List mem3 = new ArrayList();
mem3.add(member3)
I can send mem1 for LV1 adapter and mem2 for LV2 adapter and mem3 for LV3 adapter
But I cant populate project details in the white boxes.
Please provide me the best way to do this...

Better you put a List view in the form.Then create a seperate "row.xml" layout as a row of list view .
The row.xml contains 3 text boxes.
For the heading you create a text view and put in the form.Then u should populate the list view based on below coding snippet
class MyAdapter extends ArrayAdapter {
ArrayList items;
MyAdapter(ArrayList items) {
super(OrderSummary.this, R.layout.row, items);
this.items = items;
}
public View getView(int position, View convertView, ViewGroup parent)
{
//Your business login to insert data in the text boxes
}
}
MyAdapter mSchedule = new MyAdapter(mylist);
listView.setAdapter(mSchedule);

I got the solution,
I consider three listviews and create custom view for listview . Here the listview contains only one row. the design of that row is
<LinearLayout
android:id="#+id/dd"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:gravity="center_horizontal"
android:textColor="#FFFFFF"
android:textSize="27dp"
android:textStyle="bold" />
<TextView
android:id="#+id/subtitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:textColor="#FFFFFF"
android:textSize="15dp"
android:textStyle="bold" />
<Button
android:id="#+id/action"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="5dp"
android:background="#drawable/blue_button_bg"
android:text="action"
android:textStyle="bold" />
<TextView
android:id="#+id/ttt"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:textColor="#FFFFFF"
android:textSize="27dp" />
</LinearLayout>
<GridLayout
android:id="#+id/projects"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="5dip"
android:layout_marginTop="5dip"
android:layout_weight="1"
android:clipToPadding="true"
android:columnCount="1"
android:orientation="horizontal"
android:useDefaultMargins="true" >
</GridLayout>

Related

How to add dynamic row Item in activity and able to access its ids?

My requirement is: After click on + icon , a new row should add dynamically and able to access its ids. Please give suggestions to implement it.
The easiest way to do this would be to display the items in a ListView/RecyclerView and simply add the new item into adapter and let the adapter handle adding the new row Item. You don't have to care about the items id and can simply use the adapters position as an id.
When you create a view programmatically, you can assign the View id by calling View.setID(), which can be any int (it must be unique). I wouldn't recommend this approach because it'll get very tedious to track the id's and the data the items contains. Using RecyclerView/ListView elevates this problem by separating the data from the presentation layers.
This is the code to add new row dynamically, but not able to create new ids
public void onAddField(View v) {
LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
final View rowView = inflater.inflate(R.layout.field, null);
// Add the new row before the add field button.
parentLinearLayout.addView(rowView, parentLinearLayout.getChildCount() - 6);
}
in field.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal" >
<EditText
android:id="#+id/grid_Itemcode"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:inputType="textPhonetic"
android:hint="Code" />
<EditText
android:id="#+id/grid_itemdesc"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5"
android:inputType="textPersonName"
android:hint="Description" />
<EditText
android:id="#+id/grid_itemQty"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:inputType="phone"
android:hint="Qty" />
<EditText
android:id="#+id/grid_itemRate"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:inputType="phone"
android:hint="Rate" />
<Button
android:id="#+id/delete_button"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="1"
android:background="#android:drawable/ic_delete"
android:onClick="onDelete"/>
</LinearLayout>

OnItemLongClick event of listView Android

I have a list view with custom cell layout. Actually it shows data from a table, there are two button one for editing and the other is for deleting the record. these two buttons are hidden, when long click on the row then these two buttons shows up .
Here is the cell_layout :
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Customer Code and Name "
android:textSize="16sp"
android:textColor="#ff000000" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginRight="25dp">
<TextView
android:id="#+id/txtCusCode"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cus code"
android:textSize="16sp"
android:textColor="#ff000000" />
<TextView
android:id="#+id/txtCusName"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="cus Name"
android:textSize="16sp"
android:textColor="#ff000000"
android:layout_marginLeft="10dp" />
</LinearLayout>
<ImageView
android:id="#+id/imgbtnOrderActions"
android:layout_width="30dp"
android:layout_height="30dp"
android:src="#drawable/down"
android:layout_alignParentEnd="false"
android:clickable="true"
android:layout_alignParentRight="true"
android:background="#drawable/test"/>
</RelativeLayout>
<TableLayout
android:id="#+id/tblLayoutOrderAction"
android:layout_width="fill_parent"
android:layout_height="0dp">
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<ImageView
android:id="#+id/lmgbtnOrderEdit"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:src="#drawable/edit"
android:layout_weight="1"
android:layout_column="1"
android:clickable="true"
android:background="#ff00b4df" />
<ImageView
android:id="#+id/ImgbtnOrderDelete"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:src="#drawable/delete"
android:layout_weight="1"
android:layout_column="2"
android:background="#ffff625a"
android:clickable="true" />
</TableRow>
</TableLayout>
</LinearLayout>
those two buttons are in Table Layout i give them 0dp height fro hiding them.
And this is OnLongItemClick event of listView :
lstviewOrders.setOnItemLongClickListener(new AdapterView.OnItemLongClickListener()
{
#Override
public boolean onItemLongClick(AdapterView<?> adapterView, View view, int i, long l)
{
final TableLayout tblLay = (TableLayout) view.findViewById(R.id.tblLayoutOrderAction);
TableLayout.LayoutParams lay = new TableLayout.LayoutParams(30, ViewGroup.LayoutParams.MATCH_PARENT);
tblLay.setLayoutParams(lay);
return false ;
}
});
Here comes the problem . When an item in listview is long clicked then it shows the edit and delete button of that items but it also shows those button in the item which is at next 7th position . For example if i click item on position 3 then button of 3,10,17,.... are also showed ...
how to get ride of this problem ???
This sounds to me like you're dealing with the ListView's view recycling feature. This answer provides a great explanation.
Basic example: if a ListView has a total of 20 items but only enough room to show 4 on screen at the same time, then the ListView will only use 4 view objects but recycle them for each item in the list. So if you change something on view 2, then scroll down you'll find that this change also applied to view 6. This is what makes dynamic views difficult with ListViews.
In the above example, if your adapter is loading view 6, in your adapter's getView method, the convertView object is the view from 2, which is then repurposed for data element 6. I would play around with storing whether the buttons are shown in your data and resetting the convertView in this method and then showing/hiding the buttons based on the underlying data.
ListViews handle focus on displaying underlying data, but not necessarily editing that data in a view.
You could try skipping the part of your getView that tries to use the convertView so that you're always making a new view, but I'm found this can cause some other unexpected UI experiences. Good luck!
The problem is occuring because listview cells are reusing.
And when you are showing the button for a particular cell and scroll the list view then the item which is reusing that cell will also show the buttons.
To avoid the problem what you can do is take a position in adapter by any int variable and update the posion on long press in adapter.
In getView method of adapter put the position check if items are having same postion will show the button else it will set visibilty GONE.
Like in adapter : -
int selectedposition = -1;
public View getView(.........){
// your code
if (position == selectedposition){
button.setVisibility(VISIBLE);
}
else{
button.setVisibility(GONE);
}
return convertedView;
}

Custom layout for each row in a ListView

I am trying to get a button to work in a ListView Row. I been Reading about Custom Adapter but can't get it to work. Basically what i have a List_item class that have 4 TextView and 1 button which fieds a ListView in another class. one of the textViews has id/Name. so what i want is when i press the button on that row. it will get that Value of TextView "name" and add it to a ArrayList and if i press another button on different row it will add the Value of "name" to the same arraylist. so basically will add all the ones that i pressed on the button to an ArrayList. is that possible??.
JUST TO ADD. the textView Are being feed in by my database ..thanks upfront for any replies.
List_item.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="10dp" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:baselineAligned="false" >
<TextView
android:id="#+id/id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:visibility="gone" />
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
android:layout_weight="3"
android:textAllCaps="true"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:textStyle="bold"
android:typeface="serif" />
<TextView
android:id="#+id/price"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="right"
android:paddingRight="15dp"
android:textAllCaps="true"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:textStyle="bold"
android:typeface="serif" />
<Button
android:id="#+id/order"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_weight="0"
android:focusable="false"
android:minHeight="0dp"
android:minWidth="50dp"
android:text="+"
android:textStyle="bold" />
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/tableRow1"
android:gravity="center_horizontal" >
<TextView
android:id="#+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAllCaps="true"
android:textColor="#FFFFFF"
android:textSize="20sp"
android:textStyle="bold"
android:typeface="serif"
android:visibility="gone" />
</TableRow>
</RelativeLayout>
my menu.xml has
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="697dp" >
</ListView>
now i want to get Values of TextView " name " when i press the button on its row.
that is how i used to fill my listView before i add the button and it was working fine
ListAdapter adapter = new SimpleAdapter (getCategoryItems.this,itemsList,R.layout.list_item, new String[]{ TAG_ID, TAG_NAME,TAG_PRICE, TAG_DESCRIPTION},new int[] { R.id.id, R.id.name, R.id.price, R.id.description});
setListAdapter(adapter);
but now after i added the button it doesn't get any values so i reaserched and i found that i have to change my sampleAdapter to a custom Adapter. and add the button inside getView() but i can't get that hang of it.
my button OnClickListener
Button order = (Button) view.findViewById(R.id.order);
order.setOnClickListener(new Button.OnClickListener() {
#Override
public void onClick(View v) {
String name = ((TextView)view.findViewById(R.id.name)).getText().toString();
Log.d("Selected : ", name);
}
});
You will need to create a custom adapter class for your ListView. Since you are getting data from a database, I suggest that you extend CursorAdapter and override newView() and bindView(). From my experience, how to do this correctly is poorly documented, so I'll try to give some pointers here.
In newView(), you need to use a LayoutInflator which is provided to you by calling getLayoutInflator() on your ListActivity. After you call inflate() on this LayoutInflator, you can then get the Button for that specific row and set its OnClickListener.
In bindView(), you do just about all the same things, except that you don't need to inflate a new view since Android is requesting that you reuse an existing View object. You might want to create some extra methods in order to reduce the amount of repeated code.
I hope this helps even though it is explained in English rather than with a code example.

How do I correctly format a TableLayout from a Custom ListView Adapter?

Update: I am sorry i pasted in list.xml twice by mistake, my question is now correct!...
I created a class which extends ArrayAdapter, in which I override getView, and in there I capture controls in my row.xml, and setText on them appropiately with my values. This all works fine, I got no problem here.
What I then tried to do is have my output in tabular format, so I can span columns etc and get them all aligned as I wish. Here start my problem.
So I lave my two xml files, one for my list, and one for the row. In the list I define a TableLayout, with nothing in it except my ListView. Not how I set my stretchColumns property? Then in row.xml, I just define a TableRow, so I would expect to get a load of TableRows tags created inbetween the TableLayout start and end tags, and everything will turn out good.
Well it does work in the sense that I can see teh results, HOWEVER all of the TableRows are not aligned with the rest of thd table, or other rows. They just all get sixed to fit there own contents, and seems they are not properly a part of my TableLayout at all.
If I create by hand the xml I would EXPECT to be inflated in my custom adapter, and put it between the TableLayout tags (and remove the ListView) everything displays perfectly, columns aligned etc.
Perhaps I am doing something wrong, or perhaps I should not be using a TableLayout this way and ought to be doing things a different way.
Really appreciate any helps with this, been stuck puzzled on if for ages.
this is row.xml
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/tvQty"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:text="QTY"
android:textSize="12dp"
android:textStyle="bold" />
<TextView
android:id="#+id/tvPartName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:paddingLeft="10dip"
android:text="Part desererregre"
android:textSize="12dp"
android:textStyle="bold" />
<TextView
android:id="#+id/tvPartCode"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:paddingLeft="10dip"
android:text="PART CODE"
android:textSize="12dp"
android:textStyle="bold" />
</TableRow>
this is my list.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Button
android:id="#+id/addCallPart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onClick"
android:text="Button" />
<TableLayout
android:id="#+id/tableLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dip"
android:paddingRight="5dip"
android:stretchColumns="1" >
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello" />
</TableLayout>
<TextView
android:id="#id/android:empty"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="There are no records." />
</LinearLayout>
here is my code, this all works ok, but i include it to make the question clearer
public class CallPartAdapter extends ArrayAdapter<CallPart> {
private final Context context;
private final List<CallPart> values;
public CallPartAdapter(Context context, List<CallPart> values) {
super(context, R.layout.row, values);
this.context = context;
this.values = values;
}
#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.row, parent, false);
TextView textView1 = (TextView) rowView.findViewById(R.id.tvQty);
TextView textView2 = (TextView) rowView.findViewById(R.id.tvPartName);
TextView textView3 = (TextView) rowView.findViewById(R.id.tvPartCode);
textView1.setText(Integer.toString(values.get(position).Qty));
textView2.setText(values.get(position).PartName);
textView3.setText(values.get(position).PartCode);
return rowView;
}
}
You can't use TableLayout that way. Well, let me rephrase... you can but you won't get the results you desire. You've essentially got a TableLayout with a single row: the ListView. So none of the items in your ListView will receive any of the layout benefit of being in a TableLayout. They are simply ListView items.
You have two real options:
Dynamically add your rows to the TableLayout. You can still use an adapter, but it won't buy you much, since you'll simply be using it as a List.
Modify your row layout to provide a TableLayout style of layout and stick with the ListView parent.

How to make ListView singlechoice with custom row layout

I have ListView with layout for row like which I inflate at adapter ( extend BaseAdapter ) at getView method
<?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"
>
<CheckBox
android:id="#+id/chk"
android:button="#drawable/q_list_check_box"
android:layout_alignParentLeft="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_gravity="center_vertical"
android:gravity="center_vertical"
/>
<TextView
android:id="#+id/txtChoice"
android:textColor="#color/white"
android:layout_gravity="center_vertical|left"
android:gravity="center_vertical|left"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
I put at ListView tag android:choiceMode="singleChoice". How to make list single choice, that only one row can be checked at time ?
When I had to implement selection with my custom row., I used an arraylist of boolean to keep the state of the row. The size of boolean arraylist is same as rows of the listview. You can select/deselect the row via changing the value of corresponding boolean in OnListItemClick(). Anyways its just an idea. Here is a link that can help to understand this:
Custom List row with checkbox

Categories

Resources