I am adding pictures to a linearlayout programmatically. This linearlayout is surrounded by a horizontalscrollview and part of a item layout for a listview. When I have the pictures inline with the other view items, they are spaced next to eachother correctly:
However if I move the horizontalscrollview/linearlayout under the other view items, I get some weird spacing that android seems to do automatically:
So far I have tried relativelayouts, embedded linearlayouts, changing padding, changing margins, changing the width property of the linearlayout between match_parent, fill_parent, and wrap_content, but nothing changes this spacing. It is always the same.
Here is the relevant code:
LinearLayout tmpLL = (LinearLayout) convertView.findViewById(R.id.llUpgrades);
//remove previous list contents first
tmpLL.removeAllViews();
for(int i = 0; i<= tmpUpgradeList.size()-1; i++){
ImageView tmpIB = new ImageView(getContext());
Upgrade tmpUpgrade = tmpUpgradeList.get(i);
Upgrade.setUpgradePic(tmpIB, tmpUpgrade, tmpUpgrade.Title()==null);
tmpIB.setTag(position + ":" + i);
tmpIB.setPadding(5, 0, 0, 0);
tmpIB.setMaxWidth(50);
tmpLL.addView(tmpIB);
tmpIB.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
String[] split = ((String) v.getTag()).split(":");
runUpgradePopup(Integer.parseInt(split[0]), Integer.parseInt(split[1]));
}
});
tmpIB.setOnLongClickListener(new View.OnLongClickListener() {
#Override
public boolean onLongClick(View v) {
String[] split = ((String) v.getTag()).split(":");
clearUpgrade(Integer.parseInt(split[0]), Integer.parseInt(split[1]));
return true;
}
});
}
Layout of the one causing the error. The other layout puts the cards next to each other correctly but all I have different is that it is a linear layout and removed the relevant relative placement calls:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:paddingTop="5dp"
android:paddingBottom="5dp">
<Button
android:layout_width="100dp"
android:layout_height="60dp"
android:id="#+id/btnFRemoveShip"
android:text="Remove"/>
<ImageView
android:id="#+id/ivFRowShipIcon"
android:layout_height="60dp"
android:layout_width="75dp"
android:src="#android:drawable/ic_delete"
android:layout_marginLeft="10dp"
android:layout_toRightOf="#+id/btnFRemoveShip"/>
<TextView
android:layout_height="wrap_content"
android:ems="10"
android:layout_width="wrap_content"
android:id="#+id/tvFRowShipTitle"
android:text="error"
android:textSize="20dp"
android:layout_marginLeft="10dp"
android:layout_toRightOf="#+id/ivFRowShipIcon"/>
<HorizontalScrollView
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="75dp"
android:layout_marginTop="5dp"
android:layout_below="#+id/btnFRemoveShip">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/llUpgrades">
</LinearLayout>
</HorizontalScrollView>
</RelativeLayout>
Any help is greatly appreciated!
Took a couple days of rewording the question but finally found the answer.
Had to add this line before adding the image to the layout.
tmpIB.setAdjustViewBounds(true);
Thread is here: found answer
Related
I have a slight problem getting my layout_weight to work. I am creating a custom bottomBar. But i cant make it to stretch as i want it to.
Bottom Bar View
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/bottom_bar_root"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/bottom_bar_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="4"
android:orientation="horizontal"/>
</RelativeLayout>
This is the big container i am adding my buttons (items) to.
Bottom Bar Item
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<android.support.v7.widget.AppCompatImageView
android:id="#+id/bottom_bar_item_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/arrow_up_float"/>
<TextView
android:id="#+id/bottom_bar_item_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TEXT"/>
</LinearLayout>
This is my items that i add dynamically to the view. But somehow the view is not stretched properly.
But when i hardcode it in. It works. So could it be that layout weight does not work dynamically?
How i add the views (items)
private void updateItems(final List<BottomBarTab> bottomBarTabs) {
if (bottomBarTabs.size() < TABS_COUNT) {
throw new RuntimeException("Not enough buttons for bottomBar");
}
for (int i = 0; i < TABS_COUNT; i++) {
bottomBarTabs.get(i).setOnClickListener(this);
bottomBarTabs.get(i).prepareLayout();
container.addView(bottomBarTabs.get(i));
}
}
Screenshot
LayoutWeight is given to inner components of layout only not on parent Linearlayout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:weightSum="2">
<android.support.v7.widget.AppCompatImageView
android:id="#+id/bottom_bar_item_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#android:drawable/arrow_up_float"/>
<TextView
android:id="#+id/bottom_bar_item_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="TEXT"/>
</LinearLayout>
public void prepareLayout() {
View view = inflate(getContext(), R.layout.bottom_bar_item,this);
LinearLayout.LayoutParams params =
new LayoutParams(0,LayoutParams.MATCH_PARENT,LAYOUT_WEIGHT);
view.setLayoutParams(params);
if(backgroundColor != null) {
view.setBackgroundColor(backgroundColor);
}
TextView titleText = (TextView) view.findViewById(R.id.bottom_bar_item_text);
titleText.setText(title);
AppCompatImageView imageView = (AppCompatImageView) view.findViewById(R.id.bottom_bar_item_icon);
imageView.setImageResource(iconResId);
}
I changed in my prepareLayout function and put new layoutParams. Because somehow after inflation. The view ignores the weight that was set to it. So i had to force it by code. Maybe this is a android bug?
I have this XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/button_bar"
style="?android:buttonBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center"
android:gravity="center"
android:textColor="#color/md_green_400" />
<Button
android:id="#+id/action_button"
style="?android:attr/borderlessButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center"
android:gravity="center"
android:textColor="#color/md_green_400" />
</LinearLayout>
It´s just a buttonBar with two borderless buttons. It works. However, I don't want that, I need to inflate these buttons from a JSONArray. So I did this:
for (int b = 0; b < buttons.length(); b++) {
final JSONObject button = buttons.getJSONObject(b);
LinearLayout buttonBar = (LinearLayout) child.findViewById(R.id.button_bar);
View buttonChild = getLayoutInflater().inflate(R.layout.flat_button, null);
Button action = (Button) buttonChild.findViewById(R.id.action_button);
action.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {}
});
action.setText(button.getString("descricao"));
action.setTextColor(Color.parseColor(button.getString("text_color")));
buttonBar.addView(buttonChild);
}
It works too, but the buttons get a left alignment. I want they justified.
Why it works when I let them fixed but not when I inflate them?
OBS: The "button_bar" is A XML just with a LinearLayout and the "ActionButton" is just a XML with a Button.
This is the root of your problem:
View buttonChild = getLayoutInflater().inflate(R.layout.flat_button, null);
If you don't provide the parent view to the inflate() method, any LayoutParams attributes (e.g. layout_gravity) will be discarded since the parent is the one to interpret those attributes.
You can fix this by changing it to:
View buttonChild = getLayoutInflater().inflate(
R.layout.flat_button, buttonBar, false);
Which will give it the parent you're attaching it to, but not attach it to the hierarchy yet (you do that below with addView()).
I am adding list of table layouts to a LinearLayout dynamically. For that I used ScrollView to see the list of tables which are added to linear layout.
below is my xml code.
<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:orientation="vertical"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:background="#color/white"
tools:context=".MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RET MASTER SITE REPORTS"
android:paddingBottom="5dp"
android:textColor="#android:color/black"
android:textStyle="bold" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:orientation="vertical"></LinearLayout>
</ScrollView>
Source code:
layout = (LinearLayout) findViewById(R.id.linearLayout);
for (int i = 0; i < 5; i++) {
if (isColorChange) {
displayDeviceDetails(getColor(R.color.blue), getColor(R.color.lightBlue));
} else {
displayDeviceDetails(getColor(R.color.orange), getColor(R.color.lightOrange));
}
}
//Method which i am calling from loop
private void displayDeviceDetails(int titleColor, int cellColor) {
TableRow row = null;
TableLayout tableLayout = new TableLayout(this);
tableLayout.setPadding(0, 30, 0, 0);
for (int i = 0; i < arr.length; i++) {
row = (TableRow) inflater.inflate(R.layout.child_views, null);
row.setBackgroundColor(titleColor);
TextView tvTitle = (TextView) row.findViewById(R.id.tvRowTitle);
TextView tvText = (TextView) row.findViewById(R.id.tvRowText);
if (i == 0) {
tvText.setVisibility(View.GONE);
tvTitle.setGravity(Gravity.CENTER);
tvTitle.setTextColor(Color.WHITE);
tvTitle.setText(arr[i]);
} else {
changeBgColor(cellColor);
setBgColor(tvTitle);
setBgColor(tvText);
tvTitle.setGravity(Gravity.RIGHT);
tvTitle.setText(arr[i]);
tvText.setText(arr1[i]);
row.setBackgroundColor(titleColor);
}
tableLayout.addView(row);
}
layout.addView(tableLayout);
}
In the above code, There is TextView at top of the screen which is used to display some text. I added 3 tables to a linear layout it's showing 1st table from middle followed by next 2 tables with some white space/empty screen at bottom. If I increase number of tables that bottom screen empty space is increasing.
Example: There are 5 tables in a ScrollView, but it will display from 2nd table that might be from table starting or might be from middle of the table, followed by 3rd, 4th n 5th tables with empty space at bottom of the ScrollView.
I can able to see the Text, but I added 5 tables to linear layout inside ScrollView, when I executed that, it will display from 2nd table that might be from table starting or might be from middle, followed by 3rd, 4th n 5th tables with empty space. I have attachment my screen-shots.
Please help me.
Found it ! It's the android:layout_gravity="center_vertical" in the LinearLayout that is the culprit..
Just delete this and everything should be fine.
You need to change the root LinearLayout to RelativeLayout as below:
<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:orientation="vertical"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:background="#color/white"
tools:context=".MainActivity">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="RET MASTER SITE REPORTS"
android:paddingBottom="5dp"
android:textColor="#android:color/black"
android:textStyle="bold" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/textView">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"></LinearLayout>
</ScrollView>
</RelativeLayout>
I hope this helps you
I have a table of FrameLayout where each frame contains either an ImageView or a TextView. Regardless of content in the frame I want the onClick event to be detected by the OnClickListener set on the frame.
How can I achieve this?
This is some of my layout, I got a total of 5 rows (Here's only shown 1).
As described above I have 5 FrameLayouts in each row, each containing a TextView. I am not able to put my OnClickListener on the TextView since this may be changed to an ImageView at runtime. Therefore i want the OnClickListener on the FrameLayout.
It seems that the content of the FrameLayout is preventing it from detecting the click event.
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/gateContainer"
android:stretchColumns="*">
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center">
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/door1"
android:clickable="true">
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="New Text"
android:id="#+id/textView"
android:layout_gravity="center" />
</FrameLayout>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/door2" >
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="New Text"
android:id="#+id/textView5"
android:layout_gravity="center" />
</FrameLayout>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/door3" >
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="New Text"
android:id="#+id/textView4"
android:layout_gravity="center"/>
</FrameLayout>
</TableLayout>
Here is an example of how i set the OnClickListeners:
View.OnClickListener clickListener = new View.OnClickListener() {
#Override
public void onClick(View v){
// do something
}
};
TableLayout tableLayout = (TableLayout) findViewById(R.id.gateContainer);
// Go through all TableRows
for (int i = 0; i < tableLayout.getChildCount(); i++){
TableRow tableRow = (TableRow) tableLayout.getChildAt(i);
// Set listener for each FrameView
for (int j = 0; j < tableRow.getChildCount(); j++){
FrameLayout frame = (FrameLayout) tableRow.getChildAt(j);
frame.setOnClickListener(clickListener);
}
}
You could also set android:clickable="false" to the TextView/ImageView layouts and android:clickable="true" on the background, that way the background view always catches the clicks.
Additionally, the following answer might be helpful for people considering this issue:
SO: Android: How to propagate click event to LinearLayout childs and change their drawable
Just implement, OnTouchListener over ImageView and TextView components and duck them, in the sense pass them.
<your_view>.setOnTouchListener(new OnTouchListener(){
#Override
public boolean onTouch(View v, MotionEvent event) {
// TODO Auto-generated method stub
return true;
}
});
this will make sure, your container handles that.
You can define the click event on your TextView or ImageView as below:
<yourView>.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// your logic here.
}
});
I am trying to make a new layout page where I want to put two buttons, and on the above of each button I need to give a frame animation. so on loading the buttons are looking like inside the bubbles. Following is the code I am using to achieve this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/background_full">
<Button android:id="#+id/btnMusic"
android:layout_width="80dp"
android:layout_height="80dp"
android:gravity="center"
android:layout_marginLeft="215dp"
android:layout_marginTop="140dp"
android:background="#drawable/icon"/>
<ImageView android:id="#+id/imgMusic"
android:layout_width="150dp"
android:layout_height="150dp"
android:gravity="center"
android:layout_marginLeft="170dp"
android:layout_marginTop="100dp"
android:background="#drawable/button_background"/>
<Button android:id="#+id/btnMovies"
android:layout_width="80dp"
android:layout_height="80dp"
android:gravity="center"
android:layout_marginLeft="405dp"
android:layout_marginTop="140dp"
android:background="#drawable/icon1"/>
<ImageView android:id="#+id/imgMovies"
android:layout_width="150dp"
android:layout_height="150dp"
android:gravity="center"
android:layout_marginLeft="360dp"
android:layout_marginTop="100dp"
android:background="#drawable/button_background"/>
</RelativeLayout>
My jav code is like this:
public class BubbleActivity extends Activity {
/** Called when the activity is first created. */
/** Called when the activity is first created. */
Button btnMusic, btnMovies ;
ImageView imgMusic,imgMovies;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
#Override
public void onWindowFocusChanged(boolean hasFocus) {
super.onWindowFocusChanged(hasFocus);
btnMusic = (Button)findViewById(R.id.btnMusic);
btnMovies = (Button)findViewById(R.id.btnMovies);
btnMusic.setOnClickListener(new View.OnClickListener()
{
public void onClick(View v) {
Intent intent = new Intent(PixieActivity.this,Splash.class);
startActivity(intent);
}
});
ImageView imgMusic = (ImageView)findViewById(R.id.imgMusic);
imgMusic.setBackgroundResource(R.drawable.frame_animation);
AnimationDrawable frameAnimation =(AnimationDrawable) imgMusic.getBackground();
if (frameAnimation.isRunning()) {
frameAnimation.stop();
}
else {
frameAnimation.start();
}
ImageView imgMovies = (ImageView)findViewById(R.id.imgMovies);
imgMovies.setBackgroundResource(R.drawable.frame_animation);
AnimationDrawable frameAnimation1 =(AnimationDrawable) imgMovies.getBackground();
if (frameAnimation1.isRunning()) {
frameAnimation1.stop();
}
else {
frameAnimation1.start();
}
}}
But due to the margins the button layout became distracted in different phone resolutions. Is there any other way to achieve the same layout with device resolution independant. Also I want to add the bubble animation to each of the icons i will make in next pages. Please help.
I would suggest not hard-coding the margins, and instead wrap the Buttons and ImageViews in a LinearLayout each, then set the spacing using layout_weight so it is perfectly scalable.
The actual layout choice depends on if you need the button to be exactly 80x80 and the ImageView to be exactly 150x150.
For instance (pseudo-code: obviously many parameters are left out) :
<RelativeLayout>
<LinearLayout id="buttons" >
<LinearLayout layout_width = "0dp" layout_weight = "1"> <!-- 0 width is important! -->
<Button layout_gravity="center" />
</LinearLayout>
<LinearLayout layout_width = "0dp" layout_weight = "1">
<Button layout_gravity="center" />
</LinearLayout>
</LinearLayout>
<LinearLayout id="images" align with #buttons>
<LinearLayout layout_width = "0dp" layout_weight = "1">
<ImageView layout_gravity="center" />
</LinearLayout>
<LinearLayout layout_width = "0dp" layout_weight = "1">
<ImageView layout_gravity="center" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
And just make sure set the LinearLayouts "buttons" and "images" to the same height and full width so that the buttons and images overlap. More about layout_weight: What does android:layout_weight mean?
If you do not need the Buttons and ImageViews to be an exact size, think about sizing them by weight as well. Then no matter what screen you are on, if you tell a button to take up 1/4 of it through layout_weight, it will never be distorted