Develop Reference

Android - How to set margin to custom LinearLayouts in GridLayout?

I have problems with setting margin to a custom made linear layout class that I use multiple times in a GridLayout. The Gridlayout is placed in a fragment.
This is the code of fragment_grid.xml:
<FrameLayout 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"
tools:context="app_a_tize.expressme.Fragment.GridFragment"
android:layout_gravity="center">
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/orange"
android:layout_margin="5dp"
android:id="#+id/gridlayout_grid"></GridLayout>
</FrameLayout>
This is the code of the GridFragment.java:
public class GridFragment extends Fragment {
public GridFragment() {
// Required empty public constructor
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_grid, container, false);
}
#Override
public void onStart() {
super.onStart();
GridLayout grid = (GridLayout) getView().findViewById(R.id.gridlayout_grid);
grid.setRowCount(3);
int tileHeight = (CategoryTileActivity.gridContentHeight -3 * 10) / 3;
int amountofColumns = (int) CategoryTileActivity.gridContentWidth / tileHeight;
grid.setColumnCount(amountofColumns);
grid.setMinimumWidth((amountofColumns * tileHeight) + (5 * 20 ));
for (int i = 0; i < 3 * amountofColumns; i++) {
//fill the grid with the custom LinearLayout:
grid.addView(new TileClass(getActivity(), tileHeight, tileHeight, "ToBeImplemented", "Button"));
}
}
}
This is the code of the custom LinearLayout:
public class TileClass extends LinearLayout {
public TileClass(Context context, int height, int width, String image, String text) {
super(context);
this.setBackgroundResource(R.drawable.tile_button); //creates rounded layouts
this.setMinimumHeight(height);
this.setMinimumWidth(width);
this.setOrientation(LinearLayout.VERTICAL);
ImageView tileImage = new ImageView(context);
Bitmap bMap = BitmapFactory.decodeResource(getResources(), R.drawable.tilephoto);
Bitmap bMapScaled = Bitmap.createScaledBitmap(bMap, 100, 100, true);
tileImage.setImageBitmap(bMapScaled);
tileImage.setLayoutParams(new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
TextView tileText = new TextView(context);
tileText.setText(text);
tileText.setTextColor(Color.WHITE);
tileText.setGravity(Gravity.CENTER);
addView(tileImage);
addView(tileText);
}
}
When I run the Activity, I get this as result:
The code I showed above is responsible for the orange area in the middle. What I need: the blue "buttons"/LinearLayouts, in the orange area in the middle, to have a margin of 5dp. So the rest of the orange space is be taken by the custom LinearLayouts.
I don't know how to fix that, I tried a lot of options but they don't seem to work out for me.. Everything from MarginLayoutParams to params.setMargins(5,5,5,5); On almost every layout in my code.
I use Android Studio 2.1.2, supporting minimum of API 15.
Every help is appreciated!
For your imagination, this must be the end result, I need the margin like this:

You have to make custom view of gridview item as below:-
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="#dimen/categoryHeight"
android:layout_marginLeft="#dimen/margin_5dp"
android:layout_marginRight="#dimen/margin_5dp"
android:layout_marginTop="#dimen/margin_7dp"
android:background="#drawable/rounded_bg"
>
<ImageView
android:id="#+id/llRowItem"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:scaleType="fitXY"
android:gravity="bottom"/>
<TextView
android:id="#+id/item_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black_light"
android:padding="#dimen/margin_5dp"
android:layout_gravity="bottom"
android:singleLine="true"
android:textColor="#color/white"
android:textSize="#dimen/font_size_16sp" />
</FrameLayout>
and inside adapter set color of text view, background, text or image of imageview whatever you want to set.

add LinearLayout when I press "add button"

I want to add more LinearLayout in a empty one when I press "add button".
When I press the first time "it works", the empty LinearLayout show that I want but if I press the button again don't work ( LogCat show me that occurs a NullPointerException). I see that its not create a new one LinearLayout below the previous one and no idea how solve it.
Let me show you part of my code:
First, I created
static int ID=0;
...
LinearLayout mLayout []= new LinearLayout[10];
...
OnCreate:
...
mLayout[ID] = (LinearLayout) findViewById(R.id.linearLayout_expandir);
...
Then:
private OnClickListener onClick() {
// TODO Auto-generated method stub
return new OnClickListener() {
#Override
public void onClick(View v) {
mLayout[ID].addView(createNewTextView("Contain: ", ID));
mLayout[ID].addView(createNewEditText(ID));
mLayout[ID].addView(createNewTextView("Nº Liter: ",ID));
mLayout[ID].addView(createNewEditText(ID));
ID++;
}
};
}
XML: (This LinearLayout is empty: no EditText, Buttons etc and is inside another LinearLayout)
(More code from other LinearLayouts)
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.66"
android:orientation="horizontal"
android:id="#+id/linearLayout_expandir">
</LinearLayout>
(More code from other LinearLayouts)
Thank you for your time!

One question: you only have 1 LinearLayout, why do you create an array of LinearLayout while you're not adding another LinearLayout to the LinearLayout?
The error probably occurred when the ID become 1, mLayout[1] has not been initialized and you're trying to add another view to it.
LinearLayout expandir = (LinearLayout) findViewById(R.id.linearLayout_expandir);
in the onClick() method:
public void onClick(View v) {
LinearLayout linearLayout = new LinearLayout(context);
linearLayout.addView(createNewTextView("Contain: ", ID));
linearLayout.addView(createNewEditText(ID));
linearLayout.addView(createNewTextView("Nº Liter: ",ID));
linearLayout.addView(createNewEditText(ID));
expandir.addView(linearLayout);
ID++;
}

I've created a solution for you. This activity has a button that will generate layouts for you. I use an arraylist instead of an array but the idea is the same.
This is a picture of many nested layouts that have been created using this demo.
Once you get this code in your project, you will just have to add the TextView/Edit Text code that you mentioned. Let me know if you have any questions. :)
public class LinearLayoutActivity extends Activity {
/*This linear layout is the first container*/
LinearLayout outerMostLayout;
/*This array holds the linear layouts that you will create dynamically*/
List<LinearLayout> subLayouts;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_linear_layout);
// Initialize your views
outerMostLayout = (LinearLayout) findViewById(R.id.container_layout);
subLayouts = new ArrayList<LinearLayout>();
Button button = (Button) findViewById(R.id.button);
// Set the button onclick
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
// Get a reference to the container layout
LinearLayout container = outerMostLayout;
if (!subLayouts.isEmpty()) {
// Check to see if we have created any yet new containers yet
//-- If we have, then use the newest container
container = subLayouts.get(subLayouts.size() - 1);
}
// Initialize the new layout with padding to show the change
LinearLayout linearLayout = new LinearLayout(LinearLayoutActivity.this);
linearLayout.setOrientation(LinearLayout.VERTICAL);
LinearLayout.LayoutParams linearLayoutParams = new LinearLayout.LayoutParams(
android.widget.LinearLayout.LayoutParams.MATCH_PARENT,
android.widget.LinearLayout.LayoutParams.MATCH_PARENT);
linearLayout.setLayoutParams(linearLayoutParams);
linearLayout.setPadding(16, 16, 16, 16);
// Add textview with linear layout name
TextView textView1 = new TextView(LinearLayoutActivity.this);
textView1.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT));
textView1.setText("Linear Layout: " + (subLayouts.size() + 1));
textView1.setBackgroundColor(0xff66ff66); // hex color 0xAARRGGBB
linearLayout.addView(textView1);
// Add the layout to the array
subLayouts.add(linearLayout);
// Set the color of the new layout so that we can see the change
int size = subLayouts.size();
if (size % 2 == 0) {
// Every even layout will be blue
linearLayout.setBackgroundColor(getResources().getColor(R.color.blue));
} else {
// every odd layout will be red
linearLayout.setBackgroundColor(getResources().getColor(R.color.red));
}
// Finally, add the linear layout to the container layout
container.addView(linearLayout);
}
});
}
}
Here is the Layout xml
<LinearLayout 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:background="#color/red"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Generate"/>
<LinearLayout
android:id="#+id/container_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/blue"
android:orientation="horizontal"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
</LinearLayout>
</LinearLayout>

How to I do a loop of a widget(imageview and textview) in android?

Does anyone know how I could create a for loop(?) for my imageView and textView without adding them in my XML file? I'm not sure if it is possible too..so I would appreciate if someone could help me in this.
For your info, I would like to grab data from another activity. eg. If the user click the add to Favourite button, I would display another imageView & textView in this activity of the clothes image and name. The activity will also display the previous items that is added to the page.
XML file:
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/name"
android:layout_marginLeft="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="a" />
</LinearLayout>
Inside my onCreate method:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.my_favourite);
editButton = (Button)findViewById(R.id.edit);
image = (ImageView)findViewById(R.id.image);
name = (TextView)findViewById(R.id.name);
}
Thank you.

I think what you are going to want to do is in your layout have a ListView, and then you create something that implements ListAdapter (ArrayAdapter is a good choice). In your adapter you can reuse one xml file that would contain your ImageView and TextView.
There are a lot of good tutorials out there on it, Googling "ListView Adapter" will get you pretty far. Here's a good one: http://www.vogella.com/articles/AndroidListView/article.html
Yours is a pretty simple case, so you can use an ArrayAdapter like this:
Activity:
public class MainActivity extends Activity {
private ArrayAdapter<String> listAdapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listAdapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, new ArrayList<String>()) {
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View v = convertView;
if (convertView == null)
{
v = super.getView(position, convertView, parent);
}
String text = getItem(position);
TextView textview = ((TextView) v.findViewById(android.R.id.text1));
textview.setText(text);
// Now you can set an image by calling
// textview.setCompoundDrawablesWithIntrinsicBounds(...);
return v;
}
};
((ListView) findViewById(R.id.listView)).setAdapter(listAdapter);
findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
private int i = 0;
#Override
public void onClick(View view) {
listAdapter.add("item number: " + (++i));
listAdapter.notifyDataSetChanged();
}
});
}
}
Layout activity_main:
<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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context=".MainActivity">
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
tools:listitem="#layout/listview_row"
android:layout_above="#+id/button"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
Alternative:
If you are bent on not using a ListView or for whatever reason you can't use a list view, you can always inflate a layout and add it to another layout in your app. The code below would then replace the code above in the button's on click:
View row = getLayoutInflater().inflate(android.R.layout.simple_list_item_1, null); /* null here means it's not attaching/populating a view you already have */
((TextView) row.findViewById(android.R.id.text1)).setText("item number: " + (++i));
((ViewGroup) findViewById(R.id.linearlayout)).addView(row);
findViewById(R.id.linearlayout).invalidate();
Using a ListView here is the right way to go, so this is kind of a last resort.

I'm not sure of what you want, maybe this?
for (int i = 1; i <= 20; i++) {
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
Button btn = new Button(this);
btn.setId(i);
final int id_ = btn.getId();
btn.setText("button " + id_);
btn.setBackgroundColor(Color.rgb(70, 80, 90));
linear.addView(btn, params);
btn1 = ((Button) findViewById(id_));
btn1.setOnClickListener(new View.OnClickListener() {
public void onClick(View view) {
Toast.makeText(view.getContext(),
"Button clicked index = " + id_, Toast.LENGTH_SHORT)
.show();
}
});
}

how to set imagebutton resource using a for loop Android

How can i set the same image resource for a series of imagebutton using a for loop ?
ImageButton b1, b2, b3, b4, b5, b6, b7, b8, b9, b10, b11, b12, b13, b14,
b15, b16, b17, b18, b19, b20, b21, b22, b23, b24, b25, b26, b27,
b28, b29, b30;
public void setresource() {
for (int i = 0 ; i <= 15; i++){
b[i].setImageResource(R.drawable.playzz);
}
}
The above code give error on b[i]
The type of the expression must be an array type but it resolved to int

Try the below. You have not initialized ImageButton
ImageButton b[];
In your onnCreate(param)
b = new ImageButton[15];
for (int i = 0 ; i <15; i++){
b[i] = new ImageButton(ActiivtyName.this);
b[i].setImageResource(R.drawable.playzz);
}
Also remember to add the button to you root view of the layout.
Example:
You can also set the layout programatically. You can use use linear layout or relative layout set the layout parameters. Add the Imagebuttons to the layout and set the content to the activity.
Modify the below according to your requirements.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
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">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/ll"
tools:context=".MainActivity" >
</LinearLayout>
</ScrollView>
MainActivity.java
public class MainActivity extends Activity {
ImageButton b[];
LinearLayout ll;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ll = (LinearLayout) findViewById(R.id.ll);// initialize linearlayout
setresource();
}
public void setresource()
{
b = new ImageButton[15];
for (int i = 0 ; i < 15; i++){
b[i]= new ImageButton(MainActivity.this); // initilize
b[i].setMaxWidth(40); // set the maxwidth
b[i].setImageResource(R.drawable.ic_launcher); // set background image
ll.addView(b[i]); // add the imagebutton to the linearlayout
}
}
}

button with image is not responding to onclick listener when scrolling

I am a android beginner, I have added images dynamically inside the linear layout, which will scroll from right to left. The problem is that the images are moving / scrolling properly but when I click on it the on-click listener is not called.
Actually when moving the images the image button is moving but the onclick position is not changed according to the image scrolling.
public class ImageLayoutsActivity extends Activity {
int ImageInt, fromXDelta, toXDelta;
int PosInt, myHarizantalLayoutInt, aDisplayInt, aDisplayDiv = 0;
AnimationSet myAnimation = new AnimationSet(true);
LinearLayout myHarizantalLayout;
HorizontalScrollView myHorizontalScroll;
View myView;
Intent myIntent;
private Button clickedButton = null;
public int currentimageindex = 0;
TranslateAnimation myTranslateAnimation = null;
private String[] imgArr = { "icn01", "icn02" };
private String[] URLArray = { "http://www.google.co.in/",
"http://in.yahoo.com/?p=us" };
LinearLayout.LayoutParams Parems;
Display aDisplay;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
View aView = LayoutInflater.from(GroupActivity.myGroup).inflate(
R.layout.horizantal, null);
setContentView(aView);
GroupActivity.myGroup.setTitle("---CII---");
aDisplay = getWindowManager().getDefaultDisplay();
aDisplayInt = aDisplay.getWidth();
aDisplayDiv = aDisplayInt / 5;
Log.i("value##########################", String.valueOf(aDisplayDiv));
Log.i("aDisplayInt##########################",
String.valueOf(aDisplayInt));
// define xml layout here
myHarizantalLayout = (LinearLayout) findViewById(R.id.horiztonal_outer_layout_id);
myHorizontalScroll = (HorizontalScrollView) findViewById(R.id.horiztonal_scrollview_id);
// Button aBtnOne = (Button) findViewById(R.id.BtnOneId);
// Hide HorizantalLayout scroll bar
myHorizontalScroll.setHorizontalScrollBarEnabled(false);
myHorizontalScroll.isSmoothScrollingEnabled();
myHarizantalLayout.measure(aDisplay.getWidth(), aDisplay.getHeight());
Log.v("EmailActivity#########", myHarizantalLayout.getMeasuredHeight()
+ ", " + myHarizantalLayout.getMeasuredWidth());
int aLayoutInt = myHarizantalLayout.getMeasuredWidth();
Log.i("aLayoutInt###########", String.valueOf(aLayoutInt));
// Add images in for loop
for (int i = 0; i < imgArr.length; i++) {
// int aVal=myHarizantalLayout.getChildCount();
Log.i("ImageInt############################", "=====Inside the loop======");
// create button instance
final Button aImgBtn = new Button(this);
// myButton.setOnClickListener(null);
// add background image resource files
ImageInt = getResources().getIdentifier(imgArr[i], "drawable",
getPackageName());
Log.i("ImageInt############################", "ImageInt");
// add integer image values to drawable control
Drawable aDrawable = this.getResources().getDrawable(ImageInt);
Log.i("aDrawable$$$$$$$$$$$$$$$$$$$$$$$$$", "aDrawable");
// add drawable file to button instance
aImgBtn.setBackgroundDrawable(aDrawable);
aImgBtn.measure(aDisplay.getHeight(), aDisplay.getWidth());
Log.i("aButton#############################", "aButton");
Parems = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
Parems.setMargins(10, 0, 5, 0);
Log.i("Parems%%%%%%%%%%%%%%%%%%%%%%%%%%", "Parems");
// int aParemIn = Parems.width;
// Log.i("aparemIn$$$$$$$$$$$$", String.valueOf(aParemIn));
myHarizantalLayout.measure(aDisplay.getHeight(),
aDisplay.getWidth());
int myHarizantalLayoutInt = myHarizantalLayout.getMeasuredWidth();
Log.i("myHarizantalLayoutInt$$$$$$$$$$$$",
String.valueOf(myHarizantalLayoutInt));
myTranslateAnimation = new TranslateAnimation(aDisplayInt - 300,
-myHarizantalLayoutInt - aDisplayDiv, 0, 0);
myTranslateAnimation.setDuration(20000);
myTranslateAnimation.setRepeatCount(-1);
myTranslateAnimation.setRepeatMode(1);
myAnimation.addAnimation(myTranslateAnimation);
Log.i("myAnimation###########################", "myAnimation");
aImgBtn.setLayoutParams(Parems);
myHarizantalLayout.addView(aImgBtn);
Log.i("myHarizantalLayout&&&&&&&&&&&&&&&&&&&&&&&&&",
"myHarizantalLayout");
// add animation to HarizantalLayout
myHarizantalLayout.startAnimation(myTranslateAnimation);
// Call webview based on image button click event
aImgBtn.setOnClickListener(new OnClickListener() {
public void onClick(View view) {
Log.i("view$$$$$$$$$$$$#############", "---btn clicked -----");
int aVal = myHarizantalLayout.indexOfChild(view);
Log.i("indexOfChild*************************",
"indexOfChild");
if (view == aImgBtn) {
Log.i("aButton%%%%%%%%%%%%%%%%%%%%%%%%", "aButton");
aImgBtn.setId(aVal);
String aUrlStr = URLArray[aVal];
Log.i("aUrlStr$$$$$$$$$$$$#############", aUrlStr);
}
// Log.i("aUrlStr$$$$$$$$$$$$#############", aUrlStr);
// Pass values to webview activity
}
}
}
xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:gravity="bottom" android:background="#00f">
<LinearLayout android:layout_below="#+id/RelativeLayout"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="horizontal" android:gravity="bottom">
<ImageView android:id="#+id/barImageId"
android:layout_width="150dp" android:layout_height="58dp"
android:background="#drawable/cii" android:layout_alignParentRight="true" />
<HorizontalScrollView android:layout_width="fill_parent"
android:layout_height="58dp" android:id="#+id/horiztonal_scrollview_id"
android:fadingEdge="none" android:background="#000" >
<LinearLayout android:id="#+id/horiztonal_outer_layout_id"
android:fadingEdge="none" android:layout_height="fill_parent" android:gravity="center_vertical"
android:layout_width="fill_parent" android:background="#f00">
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
</RelativeLayout>

Try to Use Pager instead of HorizontalScrollView,
This link may be helpful https://github.com/nostra13/Android-Universal-Image-Loader