How to set layout margin dynamically on android - android

my app contains 3 imageviews and i used a textview as a place holder,here is my 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:orientation="vertical"
android:background="#layout/back"
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=".SplasActivity" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text=" " />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="fitXY"
android:src="#drawable/list_sher" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="fitXY"
android:src="#drawable/list_shaer" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="fitXY"
android:src="#drawable/list_fav" />
then i used below codes to change image sizes,it works fine but when i set margins for my textview, everything goes crazy. textview stays but i cant see any imageview !
private void setsize(){
// this codes work fine //
DisplayMetrics dm=new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
int w=dm.widthPixels;
int h=dm.heightPixels;
int h2=(h/7);
int w2=w-((w*10)/100);
int h3=(h/20)+1;
LinearLayout.LayoutParams pram=new LinearLayout.LayoutParams(w2,h2);
img1.setLayoutParams(pram);
img2.setLayoutParams(pram);
img3.setLayoutParams(pram);
// the problem is here //
LinearLayout ll = new LinearLayout(this);
ll.setOrientation(LinearLayout.VERTICAL);
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);
layoutParams.setMargins(0, h3, 0, 0);
ll.addView(txt1,layoutParams);
}

The second parameter of method LayoutParams() should be WRAP_CONTENT, represent height of the layout, and MATCH_PARENT means that the view wants to be as big as its parent, that cause your images disappear:
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);

Related

Android create rectangle with four different colors

How do I create a colored Rectangle like above one. Is it possible to control the length of each colored rectangle from java code? (above figure has a single rectangle with 4 colored inside it). I've been searching for answers since a few hours & was unable to find a solution.
EDIT:
I'm using AppCompatActivity and here's content_main.xml & activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.example.MainActivity"
tools:showIn="#layout/activity_main">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="1"
android:id="#+id/parentis"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="1"
android:orientation="horizontal">
<View
android:layout_width="0dp"
android:layout_height="100dp"
android:layout_weight=".25"
android:background="#dc3838"/>
<View
android:layout_width="0dp"
android:layout_height="100dp"
android:layout_weight=".25"
android:background="#c4c11f"/>
<View
android:layout_width="0dp"
android:layout_height="100dp"
android:layout_weight=".25"
android:background="#2c64e7"/>
<View
android:layout_width="0dp"
android:layout_height="100dp"
android:layout_weight=".25"
android:background="#a11a7d"/>
</LinearLayout>
</RelativeLayout>
activity_main.xml
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:src="#android:drawable/ic_dialog_email" />
Finally java code:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
View child1= new View(this);
View child2= new View(this);
View child3= new View(this);
View child4= new View(this);
LinearLayout parent = (LinearLayout) findViewById(R.id.parentis);
LinearLayout.LayoutParams childParam1 = new LinearLayout.LayoutParams(0,LinearLayout.LayoutParams.WRAP_CONTENT);
childParam1.weight = 0.15f;
child1.setLayoutParams(childParam1);
LinearLayout.LayoutParams childParam2 = new LinearLayout.LayoutParams(0,LinearLayout.LayoutParams.WRAP_CONTENT);
childParam2.weight = 0.15f;
child2.setLayoutParams(childParam2);
LinearLayout.LayoutParams childParam3 = new LinearLayout.LayoutParams(0,LinearLayout.LayoutParams.WRAP_CONTENT);
childParam3.weight = 0.20f;
child3.setLayoutParams(childParam3);
LinearLayout.LayoutParams childParam4 = new LinearLayout.LayoutParams(0,LinearLayout.LayoutParams.WRAP_CONTENT);
childParam4.weight = 0.50f;
child4.setLayoutParams(childParam4);
parent.setWeightSum(1f);
parent.addView(child1);
parent.addView(child2);
parent.addView(child3);
parent.addView(child4);
}
you can display colored rectangles on the screen by simply setting the backgroundcolor of imageviews:
imageview.SetBackground(R.color.mycolor);
Then you just need to put 4 of those ImageViews inside a LinearLayout and change their size programmatically.
first, you should get the screen size:
private Point getScreenSize(){
WindowManager windowManager = (WindowManager) YamsaferApplication.getContext().getSystemService(Context.WINDOW_SERVICE);
Display display = windowManager.getDefaultDisplay();
Point size = new Point();
display.getSize(size);
}
then write the following code:
int width = getScreenSize().x;
int redWidth = width / 4;
int orangeWidth = width / 4;
int greenWidth = width / 4;
int cyanWidth = width / 4;
LinearLayout container = new LinearLayout(getContext());
container.setOrientation(LinearLayout.HORIZONTAL);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(MATCH_PARENT,70);
container.setLayoutParams(params);
// create the red area:
View redView = new View(getContext());
redView.setBackgroundColor(Color.RED);
redView.setLayoutParams(new LinearLayout.LayoutParams(redWidth,70));
container.addView(redView);
// create the orangeArea:
View orangeView = new View(getContext());
orangeView.setBackgroundColor(Color.RED);
orangeView.setLayoutParams(new LinearLayout.LayoutParams(orangeWidth,70));
container.addView(orangeView);
//create the green area
View greenView = new View(getContext());
greenView.setBackgroundColor(Color.RED);
greenView.setLayoutParams(new LinearLayout.LayoutParams(greenWidth,70));
container.addView(greenView);
create the cyan area:
View cyanView = new View(getContext());
cyanView.setBackgroundColor(Color.RED);
cyanView.setLayoutParams(new LinearLayout.LayoutParams(cyanWidth,70));
cyanainer.addView(cyanView);
If you would like to have a simpler layout with just one view and be able to change the sizes of the rectangles dynamically you can create a simple custom view. Override the onDraw(Canvas canvas) method and inside you can do something like this:
int rectWidth = getWidth() / 4;
canvas.drawRect(0, 0, rectWidth, getHeight(), redPaint);
canvas.drawRect(rectWidth, 0, 2 * rectWidth, getHeight(), orangePaint);
canvas.drawRect(2 * rectWidth, 0, 3 * rectWidth, getHeight(), greenPaint);
canvas.drawRect(3 * rectWidth, 0, getWidth(), getHeight(), pinkPaint);
You can create paints like this:
redPaint = new Paint();
redPaint.setColor(*Your red color here*);
If you need the black border around the smaller rectangles you can just add some margin to the drawRect(...) calls above and add canvas.drawARGB(255,0,0,0) above them. For round rectangles you can use the drawRoundRect(...) methods.
use this for same size rectangle .
rectangle.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="horizontal">
<View
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="100dp"
android:background="#dc3838"/>
<View
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="100dp"
android:background="#c4c11f"/>
<View
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="100dp"
android:background="#2c64e7"/>
<View
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="100dp"
android:background="#a11a7d"/>
</LinearLayout>
and this different size rectangle....
<?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="horizontal">
<View
android:layout_width="80dp"
android:layout_height="100dp"
android:background="#dc3838"/>
<View
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#c4c11f"/>
<View
android:layout_width="50dp"
android:layout_height="100dp"
android:background="#2c64e7"/>
<View
android:layout_width="90dp"
android:layout_height="100dp"
android:background="#a11a7d"/>
</LinearLayout>
output like that .......
Note:-set id to each one and change its size using LayoutPrams....
Take a linear layout with android:weightsum="1" .Then create 4 different views inside the linear layout with android:weight=".25"
Set your desired color for each views.
Do not forget to set the orientation of linear layout as horizontal
Sample code:
<?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="wrap_content"
android:weightSum="1"
android:orientation="horizontal">
<View
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".25"
android:background="#color/your_color"/>
<View
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".25"
android:background="#color/your_color"/>
<View
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".25"
android:background="#color/your_color"/>
<View
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".25"
android:background="#color/your_color"/>
</LinearLayout>
This will distribute each color equally.If you not want to distribute each color equally then you can redistribute weight for each views.
To set the view length consisting each color:
First create a blank linear layout in your xml file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:weightSum="1"
android:id="#+id/ll_parent"
android:orientation="horizontal">
</LinearLayout>
Then in the java file:
LinearLayout parent=(LinearLayout)findViewById(R.id.ll_parent)‌​;
View child1= new View(this);
View child2= new View(this);
View child3= new View(this);
View child4= new View(this);
LinearLayout.LayoutParams childParam1 = new LinearLayout.LayoutParams(0,LinearLayout.LayoutParams.WRAP_CONTENT);
childParam1.weight = 0.25f;
child1.setLayoutParams(childParam1);
LinearLayout.LayoutParams childParam2 = new LinearLayout.LayoutParams(0,LinearLayout.LayoutParams.WRAP_CONTENT);
childParam2.weight = 0.25f;
child2.setLayoutParams(childParam2);
LinearLayout.LayoutParams childParam3 = new LinearLayout.LayoutParams(0,LinearLayout.LayoutParams.WRAP_CONTENT);
childParam3.weight = 0.25f;
child3.setLayoutParams(childParam3);
LinearLayout.LayoutParams childParam4 = new LinearLayout.LayoutParams(0,LinearLayout.LayoutParams.WRAP_CONTENT);
childParam4.weight = 0.25f;
child4.setLayoutParams(childParam4);
parent.setWeightSum(1f);
parent.addView(child1);
parent.addView(child2);
parent.addView(child3);
parent.addView(child4);

Layout Params below doesn't work programmatically

I am trying to add a rule BELOW to put a TextView below another but I can't manage to do it programmatically.
I have an XML like this :
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="200dp"
card_view:cardCornerRadius="4dp"
card_view:cardBackgroundColor="#00bcd4">
<RelativeLayout
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">
<TextView
android:id="#+id/info_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Category Name"
style="#style/Base.TextAppearance.AppCompat.Title"
android:paddingBottom="#dimen/activity_vertical_margin"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Vel voluptatem soluta ipsa. Voluptatem est quod non explicabo aut quisquam quas. Voluptatem aliquam iure voluptas"
android:id="#+id/textView"
android:paddingBottom="#dimen/activity_vertical_margin"
android:layout_below="#+id/info_text"
android:layout_above="#+id/button"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Help"
android:id="#+id/button"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Play"
android:id="#+id/button2"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
And this works fine ! I got exactly the result I want : a CardView with a category name, a description and 2 buttons.
So I tried to transpose this XML in Java because I have a lot of categories to show. I did like this :
LinearLayout linearLayoutCategory = (LinearLayout) findViewById(R.id.linearLayoutCategory);
for (int i = 0; i < categories.size(); i++) {
Category category = categories.get(i);
CardView cardView = new CardView(this);
cardView.setCardBackgroundColor(Color.parseColor("#00bcd4"));
cardView.setRadius((int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 4, getResources().getDisplayMetrics()));
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 200, getResources().getDisplayMetrics()), Gravity.CENTER);
layoutParams.setMargins(0, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 16, getResources().getDisplayMetrics()), 0, 0);
cardView.setLayoutParams(layoutParams);
RelativeLayout relativeLayout = new RelativeLayout(this);
RelativeLayout.LayoutParams layoutParams1 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);
relativeLayout.setLayoutParams(layoutParams1);
TextView textView = new TextView(this);
RelativeLayout.LayoutParams layoutParams2 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
layoutParams2.addRule(RelativeLayout.CENTER_HORIZONTAL);
textView.setLayoutParams(layoutParams2);
textView.setText(category.getName());
textView.setTextAppearance(this, android.R.style.TextAppearance_Large);
textView.setId(i);
relativeLayout.addView(textView);
TextView textView1 = new TextView(this);
RelativeLayout.LayoutParams layoutParams3 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);
layoutParams3.addRule(RelativeLayout.BELOW, textView.getId());
textView1.setLayoutParams(layoutParams3);
textView1.setText(category.getDescription());
relativeLayout.addView(textView1);
Button button = new Button(this);
relativeLayout.addView(button);
Button button1 = new Button(this);
relativeLayout.addView(button1);
cardView.addView(relativeLayout);
linearLayoutCategory.addView(cardView);
}
This creates a lot of CardView with a good positioned category name (textView) but I can't manage to position the category description. This line doesn't look to have any impact on the textView1 (corresponding to the category description) :
layoutParams3.addRule(RelativeLayout.BELOW, textView.getId());
I don't understand because the category name is good positioned and I used the same technique : addRule.
Did I forgot something or made a mistake ?
Here is one picture that to show you two result
Thank's in advance.
The problem is that your rule is based on TextView id:
layoutParams3.addRule(RelativeLayout.BELOW, textView.getId());
But since you create your TextView from code, it doesn't have any ID assigned to it. In XML your TextView has id android:id="#+id/info_text" that's why it works fine in XML.
You don't really need to transform your XML layout into code - what you need - is just inflate your layout for each category and add result to the container (I believe you use vertical LinearLayout as a container for your categories):
main_layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayoutCategory"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
category.xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="200dp"
card_view:cardCornerRadius="4dp"
card_view:cardBackgroundColor="#00bcd4">
<RelativeLayout
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">
<TextView
android:id="#+id/info_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Category Name"
style="#style/Base.TextAppearance.AppCompat.Title"
android:paddingBottom="#dimen/activity_vertical_margin"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Vel voluptatem soluta ipsa. Voluptatem est quod non explicabo aut quisquam quas. Voluptatem aliquam iure voluptas"
android:id="#+id/textView"
android:paddingBottom="#dimen/activity_vertical_margin"
android:layout_below="#+id/info_text"
android:layout_above="#+id/button"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Help"
android:id="#+id/button"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Play"
android:id="#+id/button2"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
</android.support.v7.widget.CardView>
business logic:
LinearLayout linearLayoutCategory = (LinearLayout)findViewById(R.id.linearLayoutCategory);
for (int i = 0; i < categories.size(); i++) {
View category = getLayoutInflater().inflate(R.layout.category, linearLayoutCategory, false);
TextView infoText = category.findViewById(R.id.info_text);
infoText.setText(/*category name?*/);
linearLayoutCategory.addView(category);
}

How can I programatically create a ScrollView with RelativeLayout boxes like this?

I am trying to create an Activity with a ScrollView in it. In the ScrollView will be "boxes" (sort of like a button) that is just a bit smaller than the width of the parent view and spaced slightly apart vertically. Because the boxes will have a couple different size text in a couple areas on them, I think I need to make the out of RelativeLayouts. (I would post a picture but can't with my reputation point so hopefully this makes sense).
I tried create an XML for the activity and than programatically adding the relativeviews. I got it to work, sort of, but am having trouble with the box spacing.
My test XML looks like this...
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<!-- scrolling section -->
<ScrollView
android:layout_width="fill_parent"
android:paddingTop="5dp"
android:layout_height="0dp"
android:layout_weight="1.30"
>
<LinearLayout
android:id="#+id/llScroll"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
</LinearLayout>
</ScrollView>
</LinearLayout>
My Activity looks like this...
public class TestActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
LinearLayout llAccts=(LinearLayout)findViewById(R.id.llScroll);
for (int i=1;i<20;i++) {
RelativeLayout rlView = new RelativeLayout(this);
rlView.setBackgroundColor(Color.BLUE);
TextView test=new TextView(this);
test.setText("Test #"+i);
test.setTextColor(Color.WHITE);
rlView.addView(test);
llAccts.addView(rlView,new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
}
}
}
I get the scrollable section, no problem. Problem is my blue "boxes" appear to be touching one another and I can't figure out how to make them look like buttons with padding left and right and between them. I tried
rlView.setPadding(20,20,20,20);
right after the setBackground color. All that appears to do is pad the text... not the RelativeViews.
Any suggestions no how to get this to work?
Thanks
===========
NEW INFORMATION:
Here is some additional information after following some suggestions and trial an error. I was also able to post a pic for easier reference.
===========
What I am trying to achieve, programmatically, is something that looks like this.
I achieved this example using the straight XML which looks like this...
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<!-- header: non-scrolling -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="UPDATE ALL"
android:id="#+id/btnUpdate" />
</RelativeLayout>
<!-- scrolling bottom pane -->
<ScrollView
android:layout_width="fill_parent"
android:paddingTop="5dp"
android:layout_height="0dp"
android:layout_weight="1.30"
>
<LinearLayout
android:id="#+id/llGroups"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
// individual groups start here - this section will be controlled by a database
// #1 group
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="10dp"
android:background="#color/blue"
android:padding="5dp"
android:clickable="true"
android:id="#+id/grp1"
>
<TextView
android:id="#+id/text1"
android:text="Item #1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:id="#+id/leftext1"
android:text="123.00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textSize="30dp" />
</RelativeLayout>
// #2 group
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:background="#color/blue"
android:padding="5dp"
android:clickable="true"
android:id="#+id/grp2"
>
<TextView
android:id="#+id/text2"
android:text="Item #2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/leftext2"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:id="#+id/leftext2"
android:text="456.00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textSize="30dp"
/>
</RelativeLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
I took this apart and created an XML file and and activity that will programmatically create the middle groups.
The modified XML (activity_main2) looks like this...
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<!-- header: non-scrolling -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="UPDATE ALL"
android:id="#+id/btnUpdate" />
</RelativeLayout>
<!-- scrolling bottom pane -->
<ScrollView
android:layout_width="fill_parent"
android:paddingTop="5dp"
android:layout_height="0dp"
android:layout_weight="1.30"
>
<LinearLayout
android:id="#+id/llGroups"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
</LinearLayout>
</ScrollView>
</LinearLayout>
I started rewriting my activity code to test some of the suggestions. It currently looks like this...
public class Main2Activity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2);
LinearLayout llGroups=(LinearLayout)findViewById(R.id.llGroups);
for (int i=1;i<20;i++) {
RelativeLayout rlView = new RelativeLayout(this);
rlView.setBackgroundColor(Color.BLUE);
RelativeLayout.LayoutParams rlp = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.MATCH_PARENT,
RelativeLayout.LayoutParams.WRAP_CONTENT);
rlp.setMargins(10,10,10,0);
TextView test=new TextView(this);
test.setText("Test #"+i);
test.setTextColor(Color.WHITE);
rlView.addView(test);
// other textviews will go here
llGroups.addView(rlView,rlp);
}
}
}
This compiles and runs, but the setMargins is not working. My screen has the "UPDATE ALL" button at the top like it should and (19) "Text #" with a blue background, but they are full width and touching one another so it is a solid blue background.
I am getting close, but not sure how to get the margins to set correctly for the rlView relativeview (not the textviews).
Hopefully this helps explain what I am seeing now..
SOLUTION
After suggestions, and some trial and error... here is what I had to do to achieve the desired layout in case someone else is interested.
LinearLayout.LayoutParams llp = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);
RelativeLayout.LayoutParams tvp = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
RelativeLayout.LayoutParams tvp2 = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
LinearLayout mTvContainer = (LinearLayout) findViewById(R.id.llAccts);
for (int i = 0; i < 20; i++) {
LinearLayout ll = new LinearLayout(this);
ll.setBackgroundColor(Color.BLUE);
RelativeLayout rl = new RelativeLayout(this);
TextView tv = new TextView(this);
tv.setTextColor(Color.WHITE);
tv.setPadding(5, 5, 5, 5);
tv.setText("Test #" + i);
tvp.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
TextView tv2 = new TextView(this);
tv2.setTextColor(Color.WHITE);
tv2.setPadding(5, 5, 5, 5);
tv2.setText(String.valueOf(i));
tv2.setTextSize(30);
tvp2.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);
rl.addView(tv, tvp);
rl.addView(tv2,tvp2);
ll.addView(rl);
llp.setMargins(32,16,32,16);
mTvContainer.addView(ll,llp);
}
}
For each entry in the FOR, I had to use a LINEARLAYOUT to be able to set the margins properly, and in that LINEARLAYOUT I had to use a RELATIVELAYOUT to use the addRules to get the proper positioning of the TextViews.
If there is an easier way, let me know. Thanks for everyones help!!
You are using too much nested layouts needed, here is stripped version.
xml:
<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"
tools:context=".MainActivity">
<LinearLayout
android:id="#+id/ll_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" />
</ScrollView>
Activity code:
mTvContainer = (LinearLayout) findViewById(R.id.ll_main);
int p = (int) getResources().getDimension(R.dimen.activity_horizontal_margin);
for (int i = 0; i < 20; i++) {
LinearLayout ll = new LinearLayout(this);
ll.setOrientation(LinearLayout.VERTICAL);
TextView tv = new TextView(this);
tv.setBackgroundColor(Color.BLUE);
tv.setTextColor(Color.WHITE);
tv.setPadding(p, p / 2, p, p / 2);
tv.setText("TextView " + i);
TextView tv2 = new TextView(this);
tv2.setBackgroundColor(Color.RED);
tv2.setTextColor(Color.WHITE);
tv2.setPadding(p, p / 2, p, p / 2);
tv2.setText("TextView " + i);
ll.addView(tv);
ll.addView(tv2);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);
params.setMargins(p, p / 2, p, p / 2);
mTvContainer.addView(ll, params);
}

How to fill the LinearLayout row?

I using LinearLayout as a table that need to contain 3 column.
I need to feel up the row an i don't know how to do it from the code in run time.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout"
android:paddingTop="4dip"
android:paddingBottom="6dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView android:id="#+id/Cell1"
android:layout_width="50dip"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/Cell2"
android:layout_width="70dip"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<TextView android:id="#+id/Cell3"
android:layout_width="60dip"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
This is the code that produces layout equivalent to what you have declared in your .xml
You could put it somewhere in your activity (so this refers to your activity)
LinearLayout row = new LinearLayout(this);
row.setLayoutParams(new ViewGroup.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT));
row.setPadding(0, 4, 0, 6);
row.setOrientation(LinearLayout.HORIZONTAL);
// creating and setting the cells now
// cell 1
TextView cell1 = new TextView(this);
// convert dip into pixels for LayoutParams constructor
// as it only understands px
int widthPix1 = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,
50, getResources().getDisplayMetrics());
row.addView(cell1, new LinearLayout.LayoutParams(
widthPix1, LinearLayout.LayoutParams.WRAP_CONTENT));
// cell 2
TextView cell2 = new TextView(this);
int widthPix2 = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,
70, getResources().getDisplayMetrics());
row.addView(cell2, new LinearLayout.LayoutParams(
widthPix2, LinearLayout.LayoutParams.WRAP_CONTENT, 1));
// cell 3
TextView cell3 = new TextView(this);
int widthPix3 = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,
60, getResources().getDisplayMetrics());
row.addView(cell3, new LinearLayout.LayoutParams(
widthPix3, LinearLayout.LayoutParams.WRAP_CONTENT, 1));
As you can see the amount of code is significantly bigger than when your layout is in .xml and you simply inflate with
LinearLayout row = (LinearLayout) inflater.inflate(R.layout.row, null);
And I can hardly imagine a situation when you want to do it the way you asked for.
Anyways, enjoy.
My advice if I got you right:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout"
android:paddingTop="4dip"
android:paddingBottom="6dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView android:id="#+id/Cell1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"/>
<TextView android:id="#+id/Cell2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="7"/>
<TextView android:id="#+id/Cell3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="6"/>
</LinearLayout>

Kinda circular dependency in RelativeLayout with embedded ScrollView

Basically, an Activity should display on screen:
1. A logo on top. Must always be displayed. Must center both vertically and horizontally, when choices leaves extra space on screen.
2. A ScrollView at bottom. Hosts vertical LinearLayout, which in turn hosts a set of choices a user can choose from. Must take minimal space necessary to display all choices (So logo is vertically centered). Can take up up to (Screen - Logo) space on screen. Choices are added programmatically.
Now, I have defined it in layout as:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:padding="5dp"
android:src="#drawable/logo" />
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_below="#id/imageView"
>
<LinearLayout
android:id="#+id/ChoicesPanel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
</LinearLayout>
</ScrollView>
</RelativeLayout>
If ImageView is layed out using layout_above=scrollView, ScrollView is layed out before, NOT taking into consideration minimum size of ImageView.
If ScrollView is layed out using layout_below=ImageView, ImageView just stays on top. When there are only 2-3 choices, screen looks pretty ugly.
Is there a way I can satisfy the constraints? Or should I define two different layout xml files, and switch to the correct one programmatically?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:padding="5dp"
android:src="#drawable/ic_launcher" />
<ScrollView
android:id="#+id/scrollView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/imageView" >
<LinearLayout
android:id="#+id/ChoicesPanel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_1"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_2"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_2"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_3"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_3"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_4"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_4"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_5"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_5"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_6"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_6"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_2"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_2"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_3"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_3"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_4"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_4"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_5"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_5"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_text_6"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="scroll_view_1_button_6"/>
</LinearLayout>
</ScrollView>
</RelativeLayout>
this seems to work for me. its like 14 items in the scrollview
public class TestActivity extends Activity {
private RelativeLayout mRelativeLayout;
private RelativeLayout mRelativeLayout2;
private ImageView mImageView;
private ScrollView mScrollView;
private TextView TV1;
private TextView TV2;
private TextView TV3;
private TextView TV4;
private Button B1;
private Button B2;
private Button B3;
private Button B4;
private RelativeLayout.LayoutParams lp;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mRelativeLayout = new RelativeLayout(this);
setContentView(mRelativeLayout);
mImageView = new ImageView(this);
mImageView.setId(1);
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.WRAP_CONTENT);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
mImageView.setImageResource(R.drawable.ic_launcher);
mRelativeLayout.addView(mImageView, lp);
mScrollView = new ScrollView(this);
RelativeLayout.LayoutParams lp2 = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
lp2.addRule(RelativeLayout.BELOW, mImageView.getId());
mRelativeLayout.addView(mScrollView, lp2);
mRelativeLayout2 = new RelativeLayout(this);
int itemcounts = mRelativeLayout2.getChildCount();
mScrollView.addView(mRelativeLayout2);
TV1 = new TextView(this);
TV1.setId(2);
TV1.setTextSize(20);
TV1.setText("Im a Text View. The First");
mRelativeLayout2.addView(TV1);
B1 = new Button(this);
B1.setId(3);
RelativeLayout.LayoutParams bl1 = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
bl1.addRule(RelativeLayout.BELOW, TV1.getId());
B1.setText("Im a Button. The First");
B1.setTextSize(25);
mRelativeLayout2.addView(B1, bl1);
TV2 = new TextView(this);
RelativeLayout.LayoutParams tvl2 = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
tvl2.addRule(RelativeLayout.BELOW, B1.getId());
TV2.setId(4);
TV2.setTextSize(20);
TV2.setText("Im a Text View. The Second");
mRelativeLayout2.addView(TV2, tvl2);
B2 = new Button(this);
B2.setId(5);
RelativeLayout.LayoutParams bl2 = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
bl2.addRule(RelativeLayout.BELOW, TV2.getI());
B2.setText("Im a Button. The Second");
B2.setTextSize(25);
mRelativeLayout2.addView(B2, bl2);
TV3 = new TextView(this);
TV3.setId(6);
RelativeLayout.LayoutParams tvl3 = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
tvl3.addRule(RelativeLayout.BELOW, B2.getId());
TV3.setTextSize(20);
TV3.setText("Im a Text View. The Third");
mRelativeLayout2.addView(TV3, tvl3);
B3 = new Button(this);
B3.setId(7);
RelativeLayout.LayoutParams bl3 = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
bl3.addRule(RelativeLayout.BELOW, TV3.getId());
B3.setText("Im a Button. The Third");
B3.setTextSize(25);
mRelativeLayout2.addView(B3, bl3);
TV4 = new TextView(this);
TV4.setId(8);
RelativeLayout.LayoutParams tvl4 = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
tvl4.addRule(RelativeLayout.BELOW, B3.getId());
TV4.setTextSize(20);
TV4.setText("Im a Text View. The Fourth");
mRelativeLayout2.addView(TV4, tvl4);
if (itemcounts < 4) {
lp = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.WRAP_CONTENT);
lp.addRule(RelativeLayout.CENTER_IN_PARENT);
}
if (itemcounts > 4) {
lp = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.WRAP_CONTENT);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
}
}
}
try this

Categories

Resources