In my application, I have a layout list_item.xml with 3 textviews which are filled from an array and I want to inflate this 3 textviews alone in another layout. The layout in which I want to inflate is a separate xml file layout_result.xml which has a single button and android search widget.
layout file for list_item.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minWidth="25px"
android:minHeight="25px"
android:background="#F0F8FF"
android:orientation="horizontal"
android:layout_weight="1">
<TextView
android:id="#+id/ID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/ProductName"
android:layout_alignBottom="#+id/ProductName"
android:layout_alignParentLeft="true"
android:text="New Text" />
<TextView
android:id="#+id/Status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="17dp"
android:layout_marginTop="42dp"
android:text="New Text" />
<TextView
android:id="#+id/Name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/Status"
android:layout_alignBottom="#+id/Status"
android:layout_centerHorizontal="true"
android:text="New Text" />
</RelativeLayout>
Layout for list_resut.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minWidth="25px"
android:minHeight="25px"
android:background="#F0F8FF"
android:orientation="horizontal"
android:layout_weight="1">
<SearchView
android:id="#+id/searchView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="118dp"
android:layout_marginTop="16dp" >
</SearchView>
<Button
android:id="#+id/search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/searchView1"
android:layout_marginLeft="22dp"
android:text="Button" />
</RelativeLayout>
Problem I faced when I tried to include search widget and button within list_item.xml and inflating them was that the search widget and button were being inserted in each of the 3 textview element.
So I created this separate layout list_result.xml which holds only the search widget and the button.
Question, is there anyway where I can place this list_item.xml with the textview results within list_result.xml to over come this error?
My layout inflater for list_item looks like this,
public View getView(int i, View view, ViewGroup viewGroup) {
inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View itemView = inflater.inflate(R.layout.list_item, viewGroup, false);
TextView txtName = (TextView) itemView.findViewById(R.id.Name);
TextView txtID= (TextView) itemView.findViewById(R.id.ID);
TextView txtStatus = (TextView) itemView.findViewById(R.id.Status);
txtName.setText(list.get(i).getProductName());
txtID.setText(list.get(i).getProductID());
txtStatus.setText(list.get(i).getStatus());
return itemView;
}
}
You should be able to just create a single layout XML. Not sure how you did it previously but you could do something like this:
<RelativeLayout>
<RelativeLayout>
<TextView/>
<TextView/>
<TextView/>
</RelativeLayout/>
<SearchView/>
<Button/>
</RelativeView>
If you want to keep the XML separate and then combine them at runtime, you still need a "container" for the inflated text views. You could use a FrameLayout as the container. Something like this for example:
results.xml:
<RelativeLayout>
<FrameLayout/>
<SearchView/>
<Button/>
</RelativeLayout>
items.xml
<RelativeLayout>
<TextView/>
<TextView/>
<TextView/>
</RelativeView/>
And then you can insert the textviews into the other layout like this:
ViewGroup container = (ViewGroup) findViewById(R.id.FrameLayoutId);
container.addChild(yourInflaterItemsView);
Hope this helps
Related
This is the item I'm inflating:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#drawable/background_border"
android:padding="10dp"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Account name"
android:textSize="25sp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Balance: £61.43"
android:textSize="25sp"
android:paddingTop="40dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_keyboard_arrow_right_black_24dp"
android:layout_alignParentEnd="true"
android:layout_centerInParent="true"/>
</RelativeLayout>
And I'm inflating it using the following code:
LinearLayout parent = (LinearLayout) findViewById(R.id.linearL);
view = getLayoutInflater().inflate(R.layout.menu_item, parent,false);
parent.addView(view);
Say if I inflated the following item three times, to create three menu items - how would I reference each item individually?
For example, if I wanted to change the text of the Account name in the first item of the menu, how would I reference that it's in the first item of the menu, instead of the second or third?
Say if I inflated the following item three times, to create three menu
items - how would I reference each item individually?
Use parent.getChildCount() and parent.getChildAt() for accessing Views from any R.layout.menu_item layout like:
Add layout multiple times:
//First time
parent.addView(view);
//Second time
parent.addView(view);
Get first added R.layout.menu_item layout view:
View firstView=parent.getChildAt(0);
In same way get other child View of parent layout.
Access child Views from firstView using :
View id if added in xml:
TextView textView=(TextView)firstView.findViewById(R.id.textViewID);
or using getChildAt method:
TextView textView=(TextView)firstView.getChildAt(0);
Access other views in same way.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#drawable/background_border"
android:padding="10dp"
>
<TextView
android:id="#+id/account_name_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Account name"
android:textSize="25sp"/>
<TextView
android:id="#+id/balance_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Balance: £61.43"
android:textSize="25sp"
android:paddingTop="40dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_keyboard_arrow_right_black_24dp"
android:layout_alignParentEnd="true"
android:layout_centerInParent="true"/>
</RelativeLayout>
And in code you will have some thing like
TextView textview = (TextView)relativeLayoutFromXml.findById(R.id.balance_text_view);
textview.setText("sadsasa ");
If your layout is inside activity xml you should access the textview like this:
TextView textview = (TextView) findViewById(R.id.balance_text_view);
textview.setText("sadsasa ");
A page on my app has a table layout page, and one row of it seems to not be working. My goal is to evenly split the page between the left cell and right cell. The left cell contains a string, the right cell an image and string. I have tried to do so using weighSum. The left cell got weight of 4/8, and right cell was put into a linear layout, within which the image got weight of 1/8 and the string got weight 3/8. However, in the layout the left cell is taking up the great majority of the row, about 75% and I'm not sure why.
My rows below this one attempt almost the same thing, but don't have the same problem.
My xml(cut for relevancy):
<TableRow
android:layout_width="match_parent">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Class"
android:id="#+id/classTextView"
android:layout_marginTop="14dp"
android:layout_weight="1"
android:gravity="center"/>
<LinearLayout>
<View
android:layout_width="4dp"
android:gravity="left"
android:layout_height="match_parent"
android:background="#663300"/>
<ImageView
tools:ignore="ContentDescription"
android:id="#+id/classicon"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/barbarianicon50"
android:layout_gravity="end"
android:layout_weight="1"/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Class Value"
android:id="#+id/classValueView"
android:layout_marginTop="14dp"
android:layout_weight="3"
android:gravity="left"/>
</LinearLayout>
</TableRow>
<View
android:layout_width="match_parent"
android:layout_height="4dp"
android:background="#663300"/>
<TableRow android:layout_width="match_parent">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Strength"
android:id="#+id/strengthTextView"
android:layout_marginTop="20dp"
android:layout_weight="4"
android:gravity="center" />
<LinearLayout>
<View
android:layout_width="4dp"
android:gravity="left"
android:layout_weight="0"
android:layout_height="match_parent"
android:background="#663300"/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Strength Value"
android:id="#+id/strengthValView"
android:layout_marginTop="20dp"
android:layout_weight="4"
android:gravity="center" />
</LinearLayout>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Intelligence"
android:id="#+id/intelligenceTextView"
android:layout_marginTop="20dp"
android:layout_weight="4"
android:gravity="center" />
<LinearLayout>
<View
android:layout_width="4dp"
android:gravity="left"
android:layout_weight="0"
android:layout_height="match_parent"
android:background="#663300"/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Intelligence Value"
android:id="#+id/intelligenceValView"
android:layout_marginTop="20dp"
android:layout_weight="4"
android:gravity="center" />
</LinearLayout>
</TableRow>
The first table row is the problematic one - it should be evenly split between the left and right cells, but is mostly towards the right.
The second table row is an example of it working correctly - this row has 2 pairs of cells, but each of the cells, and the pairs of cells are correctly splitting the width between themselves evenly.
I can't figure out why the first doesn't work. I appreciate any help!
I have finally succeeded in fixing the layout!
The method used was to <include /> another layout as a row element inside this one. All these row elements had the same data, so I then programmatically filled the row elements with their necessary data whenever the view changed. You could also do this as a ListView, with each row in the ListView being another pair of elements, but I'm not sure how well that works for the 4 element wide rows.
The XML of each row:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#string/statNameString"
android:id="#+id/statName"
android:layout_marginTop="30dp"
android:gravity="center" />
<View
android:layout_width="4dp"
android:gravity="left"
android:layout_height="match_parent"
android:background="#663300"/>
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#string/statValString"
android:id="#+id/statVal"
android:layout_marginTop="30dp"
android:gravity="center" />
</LinearLayout>
The top row(which represented the Class of the Character in my app) needed to include an ImageView, so it had a slightly changed layout. The ImageView was placed after the bar View, and before the last TextView.
The XML including each row into the final layout, for the Land layout:
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
layout="#layout/horizontal_class_row_layout"
android:id="#+id/strValues"
android:layout_column="0" />
<include
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
layout="#layout/horizontal_class_row_layout"
android:id="#+id/intValues"
android:layout_column="0" />
</TableRow>
If you only wanted 1 pair of elements in each row, you can simply remove one of the include tags. As mentioned before, you could also use the ListView to do these, and fill the data, and I will probably modify it to do that eventually.
Finally, you programmatically fill the elements with their data in the Java, so they don't just say "Class" and "Class Value" or whatever default data:
private void fillViewValues() {
//Gather views
LinearLayout llClass = (LinearLayout)findViewById(R.id.classValues);
LinearLayout llStr = (LinearLayout)findViewById(R.id.strValues);
LinearLayout llDex = (LinearLayout)findViewById(R.id.dexValues);
LinearLayout llCon = (LinearLayout)findViewById(R.id.conValues);
LinearLayout llInt = (LinearLayout)findViewById(R.id.intValues);
LinearLayout llWis = (LinearLayout)findViewById(R.id.wisValues);
LinearLayout llCha = (LinearLayout)findViewById(R.id.chaValues);
//Get the layout's locations
TextView classNameView = (TextView) llClass.findViewById(R.id.statName);
TextView classValView = (TextView) llClass.findViewById(R.id.statVal);
ImageView classImage = (ImageView) llClass.findViewById(R.id.classicon);
TextView strNameView = (TextView) llStr.findViewById(R.id.statName);
TextView strValView = (TextView) llStr.findViewById(R.id.statVal);
TextView dexNameView = (TextView) llDex.findViewById(R.id.statName);
TextView dexValView = (TextView) llDex.findViewById(R.id.statVal);
TextView conNameView = (TextView) llCon.findViewById(R.id.statName);
TextView conValView = (TextView) llCon.findViewById(R.id.statVal);
TextView intNameView = (TextView) llInt.findViewById(R.id.statName);
TextView intValView = (TextView) llInt.findViewById(R.id.statVal);
TextView wisNameView = (TextView) llWis.findViewById(R.id.statName);
TextView wisValView = (TextView) llWis.findViewById(R.id.statVal);
TextView chaNameView = (TextView) llCha.findViewById(R.id.statName);
TextView chaValView = (TextView) llCha.findViewById(R.id.statVal);
//Fill those values
//Names of sections
classNameView.setText(getResources().getString(R.string.classString));
strNameView.setText(getResources().getString(R.string.strString));
dexNameView.setText(getResources().getString(R.string.dexString));
conNameView.setText(getResources().getString(R.string.conString));
intNameView.setText(getResources().getString(R.string.intString));
wisNameView.setText(getResources().getString(R.string.wisString));
chaNameView.setText(getResources().getString(R.string.chaString));
//Values
classValView.setText(classString);
setImage(classImage, classString);
strValView.setText(String.format("%d", finalStats[0]));
dexValView.setText(String.format("%d", finalStats[1]));
conValView.setText(String.format("%d", finalStats[2]));
intValView.setText(String.format("%d", finalStats[3]));
wisValView.setText(String.format("%d", finalStats[4]));
chaValView.setText(String.format("%d", finalStats[5]));
}
This follows the advice at at this StackOverflow post.
One thing I would like to note, is that when you change the layout, you need to reset the content view to your current layout. In my case, the function looked like:
#Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
if(newConfig.orientation == Configuration.ORIENTATION_LANDSCAPE)
{
setContentView(R.layout.activity_see_character);
fillViewValues();
}else if(newConfig.orientation == Configuration.ORIENTATION_PORTRAIT)
{
setContentView(R.layout.activity_see_character);
fillViewValues();
}
}
where fillViewValues() is the previous function. I believe that this sets the layout to either the portrait or landscape version of the layout, which can then have its elements accessed. If you don't do this when you try to access the elements it can't find them and gives a NullPointerException.
I realize there many related problems, but I'm looking for this specific answer. The below code is my XML for my mainactivity in an app. Now my question. I would like to be able to alter the contents of the horizontal view, dynamically. This will involve clearing it of Views as well as adding new ones. How exactly do I go about doing this, as well as accessing the Linear Layout within it, when I tried to assign an ID to the Linear Layout I was given an error saying it could not accept a id of type string.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<TextView
android:id="#+id/txtClassification"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="Classification:<>"
android:textAppearance="?android:attr/textAppearanceLarge"
tools:ignore="HardcodedText" />
<Spinner
android:id="#+id/spinGoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginBottom="56dp" />
<Button
android:id="#+id/btnBack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="Go Back"
tools:ignore="HardcodedText" />
<Button
android:id="#+id/btnSelect"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="Select"
tools:ignore="HardcodedText" />
<HorizontalScrollView
android:id="#+id/gallery"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/txtClassification"
android:layout_alignRight="#+id/spinGoto"
android:layout_below="#+id/txtClassification" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
</LinearLayout>
</HorizontalScrollView>
<ImageView
android:id="#+id/myImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</RelativeLayout>
All help is greatly appreciated!
You will have to work with the LinearLayout because a HorizontalScrollView can only have one direct child.
<HorizontalScrollView
android:id="#+id/gallery"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/txtClassification" >
<LinearLayout
android:id="#+id/yourLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
</LinearLayout>
</HorizontalScrollView>
Then you access it programmatically to add or remove views
public void addView(View v) {
LinearLayout yourLayout = (LinearLayout) findViewById(R.id.yourLayout);
yourLayout.addView(v);
}
public void clearLayout() {
LinearLayout yourLayout = (LinearLayout) findViewById(R.id.yourLayout);
yourLayout.removeAllViews();
}
public void removeView(View v) {
LinearLayout yourLayout = (LinearLayout) findViewById(R.id.yourLayout);
yourLayout.removeView(v);
}
hope this helps
The id has a predifined format. Enter the name you want after the "#+id/" syntax. Example android:id="#+id/layout".
Then in code get the LinearLayoutinside of the HorizontalScrollView:
LinearLayout layout = findViewById(R.id.layout);
To add a View to layout call the adView() of your layout. Example:
//add 5 buttons
for (int i = 1; i <= 5 ; i++){
Button btn = new Button(this);
btn.setId(i);
btn.setText(i+"");
layout.addView(btn);
}
To remove a View from the layout call removeView()
//remove button nr. 3
Button btn3 = layout.findViewById(3);
layout.removeView(btn3);
The HorizontalScrollView takes care of everything, you just have to populate and organize the elements inside the nested LinearLayout.
Good luck!
I use DraggableGridView to create a ViewGroup, and I want to add my custom view into it.
Below is my custom layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/Green"
android:gravity="center_horizontal"
android:orientation="vertical" >
<ImageView
android:id="#+id/item_img"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:padding="10dp"
android:scaleType="fitCenter"
android:src="#drawable/default_avatar" />
<TextView
android:id="#+id/item_name"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/Gray"
android:gravity="center"
android:text="Name" />
</LinearLayout>
As you can see, the background color of LinearLayout should be green, which is displayed correctly in the ViewGroup.
However, the ImageView and the TextView aren't displayed on the screen, neither even the background color of the TextView.
And this is my code to add the custom view:
LayoutInflater vi = (LayoutInflater) this
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View v = vi.inflate(R.layout.item, null);
TextView textView = (TextView) v
.findViewById(R.id.item_name);
textView.setText(contact.getName());
textView.setTextColor(Color.WHITE);
gridView.addView(v);
What's the problem? Thank you.
Here is my Prent layout (main.xml)
<!-- ============================================================ -->
<!-- All Employees are added here (added and More then one) -->
<!-- ============================================================ -->
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/myLayout"
android:orientation="vertical"
android:layout_gravity="center_vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#00000000">
<!-- ++++++++ here extra layout is added programmatically -->
</LinearLayout>
Here is my another layout file that I want as child, say child.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:orientation="horizontal" >
<Button
android:id="#+id/btn_left"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:singleLine="false"
android:maxLines="2"
android:text="hello"/>
<TextView
android:id="#+id/list_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:gravity="center_horizontal"
android:text="Photos"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/btn_right"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="Save" />
</LinearLayout>
Now in my Main activity I am calling the main.xml and based on the for loop condition I want to add the layout of the child.xml and every time I want to set the different value of the TextView of child.xml
So how it is Possible?
I have done like this:
private void doCalculationForMultipleEmployee() {
singleEmployee.setVisibility(View.GONE);
for (int i = 0; i<=tempEmployerList.size()-1; i++) {
View repeatedLayout = LayoutInflater.from(getApplicationContext()).inflate(R.layout.test);
((TextView)repeatedLayout.findViewById(R.id.list_title)).setText("Employee"+i);
// customize repeatedLayout with other data
myLinearLayout.addChild(repeatedLayout);
}
}
But after doing that I got syntax error at .inflate and at .addChild
So where have I gone wrong? Please help me by some code to add it by for loop.
Just create a loop like below:
LinearLayout parent=findViewById(R.id.myLayout);
for(int i=0;i<list.size();i++)
{
LinearLayout llItem=(LinearLayout)LayoutInflater.createFromSource(R.layout.child, null);
TextView txt= (TextView)llItem.findViewById(R.id.title);
txt.setText(list.get(i));
parent.add(llItem);
}
Inflate the view then add to the parent
LinearLayout parent = (LinearLayout)findViewById(R.id.myLayout);
LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
Layout child = inflater.inflate(R.layout.myLayout2, null);
TextView title = (TextView)child.findViewById(R.id.list_title);
parent.addView(child);
Repeat as many times as necessary or use a loop
If i understood your question correctly you need to display button, textview and button side by side in your layout.
If you want this you just take listview and use custom adapter, with this you can display button, text and button side by side