I am developing an app in which I want to add textviews in a column-wise order. Atmost 3 textviews can fill horizontally the screen width. If there are more than 3 textviews to be added, the new ones should be added in the next row, and so on. See the diagram below-
---1st---------------2nd--------------3rd
---4th----------------5th-----and so on
I know we need to use a nested linear layout with different orientation parameters. But how do I get around this "maximum 3 textviews per row constraint". I know that this has to do something with the weight parameter. The code I have written so far is-
LinearLayout out = (LinearLayout) findViewById(R.id.linear_params);
TextView mView = new TextView(this);
mView.setText("placeholder");
mView.setLayoutParams(new LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT));
out.addView(mView);
And for the layout I have written-
<LinearLayout
android:id="#+id/out
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_margin="5dp">
<LinearLayout
android:id="#+id/in
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:orientation="horizontal">
<TextView ... />
</LinearLayout>
</LinearLayout>
How should I modify the above xml and code so that I am able to place the views dynamically as required ?
The correct way to do this will be to use a GridView Component with three columns. It will allow you to add the views as well.
If you use LinearLayout you will have to use weights and keep adding new LinearLayout per row, this will take a lot of processing for calculations and overdrawing as well.
Using GridView will help to avoid writing the code to calculate and add every row and every view and will keep the layout optimized as well.
Related
how do i create a multiple row app with the same data for each row. This is how all the rows are to look like. it contains three text views and two spinners. this app is to help calculate the gpa of a student for one semester.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
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="com.mbedobe.android.samplegpacalculator.app.MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="C1"
android:id="#+id/course_textView"/>
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/spinner"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/course_textView"
android:layout_toEndOf="#+id/course_textView"
android:layout_marginLeft="23dp"
android:layout_marginStart="23dp" />
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/spinner2"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/spinner"
android:layout_toEndOf="#+id/spinner"
android:layout_marginLeft="23dp"
android:layout_marginStart="23dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/spinner2"
android:layout_toEndOf="#+id/spinner2"
android:id="#+id/gradePoints"
android:layout_marginLeft="23dp"
android:layout_marginStart="23dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/gradePoints"
android:layout_toEndOf="#+id/gradePoints"
android:id="#+id/gradeValue"
android:layout_marginLeft="23dp"
android:layout_marginStart="23dp"/>
</RelativeLayout>
You should think about using a ListView with BaseAdapter.
The best solution is to use RecycleView
Use a RecyclerView with a custom adapter. The layout above will be the row layout for each row in this case.
Use the links above to understand how you can create your own Custom RecyclerView Adapters with Custom Layouts.
EDIT:
Ok, I'll give you the basics here. There are three major things you need for a custom RecyclerView.
They are:
List of Objects (your data)
A custom layout for each row
An Adapter that will transform your data onto the above layout.
Now, let's take an example and try and explain this.
You must have seen popular apps like Gmail, WhatsApp, etc.
When you open these apps, you see a list of Emails/Chats etc.
One thing to notice is that the layout for each row is same, even though the content inside them is different.
This tells us 2 things: first that the data must be a list of the same kind of objects, and secondly that the layout of each row is the same. So, to create such a listView or RecyclerView, we shouldn't need to create as many layouts as there are rows. One layout can be reused for each row.
So, two of our three needs are understood. The final item required is the Adapter. The adapter is what takes your List and converts each item from the list into a row on your RecyclerView. These rows are automatically created by the Adapter as the user scrolls through the list, and removed when the user can no longer see those rows.
If you want code for this, let me know. I'll upload code explaining this. But I would recommend you try it out on your own. It's not that hard.
Either use ListView, recyclerView or dynamically add the items in scrollview.
Use of ListView or RecyclerView will be the best approach for you.
I'll give you the last option that should be worked from java only if you are with good knowledged in java. ( only the steps not complete code)
1) your xml file should contain scroll view.
2) for each item to be added (3 textview 2 spinner), add a layout and provide layout params for it i.e width/height/orientation/background etc.
3)add this layout to the scrollview you created in xml by
findViewById(R.id.scrollviewId).add(layout)
4)create your textviews/spinners in and give them layout params.{ this process is much logical in a pattern of your design so must be very careful}
5)add all these textviews/spinners in the layout you created in step 3.
Note: according to your design requirements you might need to add other layouts in between the layout created in step 2/3 and other items created in step 4.
Here is the code you liked:
LinearLayout myLayout = (LinearLayout)findViewById(R.id.layout_in_xml);
for(int i = 0; i < required_fields.length; i++){
LinearLayout lr = new RelativeLayout(DisplaySadip.this);
LayoutParams layoutParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
lr.serLayoutParams(layoutParams);
lr.setOrientation(LinearLayout.HORIZONTAL);
//add linear layout to your layout in xml
myLayout.add(lr);
//add textview, spinner to this layout now
TextView tv1 = new TextView(YourActivity.this)
tv1.setLayoutParams(new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
tv1.setText("......"+i);
lr1.add(tv1)
Spinner spinner1 = new Spinner(YourActivity.this)
spinner.setLayoutParams(new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
Spinner spinner2 = new Spinner(YourActivity.this)
spinner.setLayoutParams(new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
lr.add(spinner1);
lr.add(spinner2);
TextView tv2 = new TextView(YourActivity.this)
tv2.setLayoutParams(new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
tv2.setText("......"+i);
lr.add(tv2)
TextView tv3 = new TextView(YourActivity.this)
tv3.setLayoutParams(new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
tv3.setText("......"+i);
lr1.add(tv3)
}
it shall add add many no of views you want in your layout.
I'm looking for a way that I can dynamically add views into a layout (currently a LinearLayout) and that they won't overflow into the end of the screen and be hidden.
I can't use ScrollViews since it has to look like one sentence (It's a "fill the blanks" question).
I'm just looking for an idea on how to do this, not the code itself.
Thanks in advance, Shay.
If you are using linear layout than use linear layout with weights:
For example:
You have a LinearLayout with vertical orientation and you have 2 ImageViews inside it and you want these ImageViews always to take equal space.
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="2"
android:orientation="vertical"
android:layout_gravity="center">
You can set the layout_weight of each ImageView to 1 and the weightSum in LinearLayout to 2 to achieve this.
<ImageView
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_height="0dp"/>
This will work correctly for any device without overflow into the end of the screen and be hidden
i've seen this question added on the stack but the information hasn't been helpful or successful yet, so i remain quite not sure.
The gist of what I'm trying to do:
I have a layout defined in xml, some_details_view.xml for example.
setContentView(R.layout.some_details_view);
It has a bunch of text views laid out using a parent relative layout, a linear header layout, a linear footer layout, a middle scroll layout that contains a relative layout that hold some label - value type of text views.
And at the bottom of the scroll view relative layout, I currently placed a frame layout as a place holder.
On create of the corresponding activity, I set text in respective text views with data handed over from previous activity; basic stuff.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/white" >
<LinearLayout
android:id="#+id/header"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" >
...some header content
</LinearLayout>
<LinearLayout
android:id="#+id/footer"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
..some footer content
</LinearLayout>
<ScrollView
android:id="#+id/scroll"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/footer"
android:layout_below="#+id/header"
android:layout_margin="5dip" >
<RelativeLayout
android:layout_width="fill_parent"
android:id="#+id/relativeScroll"
android:layout_height="wrap_content" >
...text views in relative layout
<FrameLayout
android:id="#+id/placeholder"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/moreInfoValue" />
</RelativeLayout>
</ScrollView>
</RelativeLayout>
After setting up text views for the given data, I use an async task to get some additional data that I want to show as a history list type of thing at the bottom of the static form layout. There could be 0 or more items so I either add 1 or more text views or none at all.
In the post execute, which I understand to run on the main UI thread, I try to find an exiting container Layout/view group and add either a new Linear Layout to which I add new text Views, or just add the new text views directly to the existing container layout.
here's the latest thing I tried:
ViewGroup mContainer = null; //defined as member variable of activity class and instatiated in on create
mContainer = (ViewGroup)findViewById(R.id.placeholder); //set in on create
LinearLayout ll = new LinearLayout(context); //on post execute of async task
ll.setOrientation(LinearLayout.VERTICAL);
mContainer.addView(ll); //add a new linear layout to an existing container layout
//add some new text view widgets items dynamically
for(NewDisplayItem item : items)
{
TextView tv = new TextView(context);
tv.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);
tv.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);
tv.setText(item.getSomeText());
ll.addView(tv); //add text view to new linear layout
}
When the UI loads I don't see new items added to my layout after stepping through and watching the controls get added using the code above.
Not sure what it is but something doesn't seem right about this approach in addition to the fact that it's not working. When the activity loads up, all the static views are setup and in view. I pop up a loading dialog, step through the async task stuff and I guess expect to see the dynamic controls add to the layout one by one?
First of all textView.setWidth(int) takes as parameter the width in pixels.
Second you should also set your layout parameters on the LinearLayout you are adding.
The way you should set LayoutParams is as follows :
ll.setLayoutParams(new LinearLayout.LayoutParams(
LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));
the same for yout TextViews.
Ovidiu Latcu has a good answer. A good question is: is there a reason why you aren't using a ListView (which btw there ARE cases where what he's doing works better)? A ListView has a lot of mechanisms to help you keep from running out of RAM
I do not want to use TableLayout because my data model and UI perfectly fit into ListView. But I need to have fields in list items to organize in columns through hole ListView. I want to use two-line list item model with about 4-5 columns in a second line. I do know how to make custom layouts and custom array adapters for ListView. The question is about positioning TextView's in a list item custom layout so that they become nicely aligned. Surely I can not use absolute widths because there are so many screen sizes, but I can not think of any other option.
If you wrap your TextViews in a LinearLayout then you can use the layout_weight attribute:
<LinearLayout android:orientation="horizontal">
<TextView android:layout_width="0dp" android:layout_weight="25">
<TextView android:layout_width="0dp" android:layout_weight="25">
<TextView android:layout_width="0dp" android:layout_weight="25">
<TextView android:layout_width="0dp" android:layout_weight="25">
<LinearLayout>
This will make your TextView occupy 25% of the available width and should keep them vertical aligned(you could also set the gravity for the TexView to left). The above code is an example for 4 TextViews, if you have more or less you must adapt the layout_weight attribute so that the sum of all the layout_weight attributes is 100.
I hope this is what you want.
I'm trying to layout views in a relative layout on a tablet, much like a bookshelf. There will be so many across, then a new row is created.
My initial state looks like this:
<ScrollView
android:layout_marginTop="150sp"
android:layout_marginLeft="50sp"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:id="#+id/user_list"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<!-- Add User Avatar -->
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/user_frame" />
<ImageView
android:id="#+id/demo_image"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/add_user"
android:layout_marginLeft="10px" />
<ImageView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/user_name_background"
android:layout_marginLeft="10px" />
<TextView
android:id="#+id/user_name"
android:layout_width="180px"
android:layout_height="wrap_content"
android:textSize="20sp"
android:textStyle="bold"
android:gravity="center_horizontal"
android:text="Add New User" />
</RelativeLayout>
</RelativeLayout>
</ScrollView>
I'm fetching records from a database, and for each record I need to place a version of the "add user avatar" section as seen above. I'd like to do 5, then wrap to a new row.
My initial idea was to use a layout inflater and add the views programmatically, using RelativeLayout.LayoutParams to set the layout_toRightOf values.
There must be an easier way though. I've seen lots of applications using the "bookshelf" metaphor.
There are a few options I can think of.
Instead of using a relative layout, why not use LinearLayouts with the horizontal attribute?
Using a TableLayout, much like the LinearLayout
Use a ListView with a custom adapter to fill five 'Add User Avatar's' per ListRow
Laying out views programmatically is fairly simple. I do this for all of my activities / views. I love Android's XML layout concept but find that as soon as the views become at all dynamic based on external data (such as your database) then it gets too complex.
I choose what my outermost layout will be and then only instantiate that layout in the XML. Then in my activity I find the outer layout using the normal find by id call and then use a sequence of add(View) method calls to add my dynamically created views or layouts as needed.
You will need to take into account different screen orientations, pixel densities and sizes. Device Independent Pixels will become your friend. For example, to create an image view, you would load the bitmap, figure out how much to resize it (if needed) and then set it as the drawable for a new ImageView instance, that you then add to the layout.
Sounds like your outer layout will be a scroll view with a vertical linear layout inside, that then has a horizontal layout for each "shelf" that then have up to five image views for each "book"