I got this screen that have some static and some dynamic views to be created.
I want infinity number of views to be created and i think dynamic is the way forward
Now all i need is to create the top column with image buttons , the edittext with clientname and the spinner with cash in the xml (this is the layout i have currently) now i want if a user clicks the cart icon the views with product name, quantity and price to be generated dynamically and then the bottom views are also generated via xml
like this
As you can see there're two row of product,quantity and price. Currently this is done via xml can someboy help out how can i generate and arrange the row with quantity and price and product name in between an existing xml layout like this?
NB: the main layout is relative layout and the layout that contains the row to be generated dynamically is this
<LinearLayout
android:id="#+id/laygroup0"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/lvpaymode"
android:gravity="center"
android:orientation="vertical" >
<AutoCompleteTextView
android:id="#+id/autoproduct0"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:drawableLeft="#drawable/ic_shopping_cart_black_24dp"
android:ems="10"
android:hint="#string/strproductname"
android:padding="10dp"
android:singleLine="true" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<EditText
android:id="#+id/autoquantity0"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:drawableLeft="#drawable/ic_local_mall_black_24dp"
android:ems="10"
android:hint="#string/strquantity"
android:inputType="numberDecimal"
android:padding="10dp"
android:singleLine="true" >
</EditText>
<EditText
android:id="#+id/autoprice0"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:drawableLeft="#drawable/ic_attach_money_black_24dp"
android:ems="10"
android:hint="#string/strprice"
android:inputType="numberDecimal"
android:padding="10dp"
android:singleLine="true" >
</EditText>
</LinearLayout>
</LinearLayout>
I can not give complete code bc I'm writing from my phone, but I can give you more pointers.
Create the parent layout in xml in the main layout. It will be much easyer if its a LinearLayout (any other layout it will be much harder to deal with, more care and more code).
Then use findViewById to reference the parent it in java code:
LinearLayout parent = findViewById(R.layout....);
You will use the parent to add in it the child views.
Next set up a button with an onClick event hooked up. In the onClick event you will inflate the child layout: View child = LayoutInflater.from(context).inflate(R.layout.childxml);
Next use TextView tv = child.findViewById(... to find all the views contained in it etc. Set up other button events here if you have buttons.
At last you can add the child to the parent: parent.addView(child);
If the parent its a linear layout with the orientation set to vertical all the views will arrange nicely one below the other.
If you add many views you risk extending more than the phone's screen allows it and it will not be scrollable. You can overcome this by wrapping the parent linear layout with a ScrollView in xml. Now it will work nicely.
Hope it helps.
Related
I tried Expand ListView method from using the code from the following blog, https://wirasetiawan29.wordpress.com/2016/01/20/membuat-expand-listview-material-design-di-android/
Everything works fine. But if I add a button in FrameLayout then the touchevent for listview item not works properly. Also I tried changing FrameLayout to Relative & also to Linear, but still no success.
<FrameLayout
android:id="#+id/wrapper"
android:layout_below="#+id/rl_title_wrapper"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.AppCompatTextView
android:id="#+id/deskripsi"
android:padding="16dp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:text="Share"/>
</FrameLayout>
Thanks in advance.
According to Frame Layout description by Google's documentation...
FrameLayout is designed to block out an area on the screen to display
a single item. Generally, FrameLayout should be used to hold a single
child view, because it can be difficult to organize child views in a
way that's scalable to different screen sizes without the children
overlapping each other. You can, however, add multiple children to a
FrameLayout and control their position within the FrameLayout by
assigning gravity to each child, using the android:layout_gravity
attribute.
Hence, your original TextView is actually overlapping by the Button (Share). You can use android:layout_gravity="right" to position the button in the right end of the screen, however, then you will have to fix the maxium length of string for TextView, so that it doesn't get overlap by the Button on the right.
If you don't have any problem, might I suggest you to use LinearLayout? It's easier to handle and render by the GPU (As far as I know). Here's an example code of your item...
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/wrapper"
android:layout_below="#+id/rl_title_wrapper"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:id="#+id/deskripsi"
android:padding="16dp"
android:layout_weight="1"
android:layout_gravity="left|center"
android:text="This is a big chunk of description for your listView item. you can write as much as you want...."
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Share"
android:layout_gravity="right|center"/>
</LinearLayout>
You can also use RelativeLayout and GridLayout here.
I hope it answers your question. Cheers!
I have a simple fragment dialog with a listview, EditText and two button (accept and cancel).
I want my layout to look like this:
Listview on top
EditText right below
and
Buttons side by side below edittext.
Now my problem is that listview can have 0 or a 100 elements.
So if I put everythis in a vertical LinearLayout and listview has a lot of elements the edittext and buttons get pushed out of view. And if I use relative layout and say that edit text is aligned parent bottom and below the listview that it looks ok for 100elements but when the listview is empty the dialog uses all of the screen space.
Here is an example of my code when using relativeLayout. Is there another way to make is so that linearLayout with id "below" is below the listview but will still be visible(if list view has a lot of items) without using alignParentBottom="true" because that is the reason the layout stretches to full screen.
<?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="wrap_content"
android:orientation="vertical" >
<ListView
android:id="#+id/ListViewPreNotes"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/bottom" />
<LinearLayout
android:id="#+id/below"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentBottom="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:padding="3dp">
<TextView
android:layout_height="#dimen/label_height"
android:layout_width="130dip"
android:text="#string/note"
android:layout_marginLeft="10dip"
android:gravity="center_vertical"
android:textSize="#dimen/text_size_large"/>
<EditText
android:id="#+id/OMnote"
android:layout_height="wrap_content"
android:layout_width="200dp"
android:textSize="#dimen/text_size_large"
android:inputType="textNoSuggestions|textCapSentences"
android:selectAllOnFocus="true"
android:hint="#string/note"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:baselineAligned="false">
<Button
android:id="#+id/dialogButtonClose"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="50dp"
android:text="#string/ok"
style="?android:attr/borderlessButtonStyle"
android:textStyle="bold" />
<Button
android:id="#+id/dialogButtonCancel"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="50dp"
android:text="#string/cancel"
android:textStyle="bold"
style="?android:attr/borderlessButtonStyle" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Set ListView.Visibility to Gone when no records found and use RelativeLayout and align parent bottom.
you can add what you need to show below the ListView in its footer. You can add it like this.
View footerView = ((LayoutInflater) ActivityContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout.footer_layout, null, false);
ListView.addFooterView(footerView);
You can use FrameLayout as the root and then you can place your LinearLayouts on top of the ListView.
http://developer.android.com/reference/android/widget/FrameLayout.html
Some credit goes to Arsalan Shah for his suggestions.
This is the final version of how I solved my problem (kind of hacky):
First I check how many elements I have in a list view then depending on that and depending on the device and orientation mode (portrait or landscape) I inflate eather the layout in my question or another layout with listview footer that Arsalan Shah suggested.
Example:
If the device is below 7" and it is in landscape mode and the number of items in my list is above 4 I will use my layout otherwise I will use Arsalan Shah suggestion. I sort of tested for what the number of items on which layout/device should be for what layout to find the best case scenario for my design.
Hope this helps anyone else that might have the same problem.
If anyone has a suggestion how to do all this in only one layout then please comment below.
I have a layout contain one image and 3 text field
I've tried to align the image to right and text field to left but I've failed
I've used
android:layout_gravity="right" for image and left to text but it did not work also I've used end and start in gravity with no success
this is the layout code:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:orientation="vertical"
android:background="#drawable/card_background">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/listthumb"
android:layout_width="80dp"
android:layout_height="50dp"
android:layout_gravity="center_vertical"
android:contentDescription="Rss video thumbnail"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/listtitle"
style="#style/listTitle"
android:maxLines="3"/>
</LinearLayout>
<TextView
android:id="#+id/shortdescription"
android:layout_width="wrap_content"
android:ellipsize="end"
android:maxLines="2"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/listpubdate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="11dp"/>
</LinearLayout>
</FrameLayout>
Try to use a <RelativeLayout> instead of a <LinearLayout>
With the RelativeLayout you could place a widget depending on the position of another widget
Here the Relative Layout description
Hope this will help, I have not had time to test....
One linear layout should have vertical orientation and contain the 3 text fields.
One linear layout should have horizontal orientation and contain both the above linear layout and the image.
To push two views to the edges of the screen, you can also give each a left/right margin and then put a blank view with weight = 1 in between them.
Please read a bit more on how layouts work on Android and the different types available to you. A LinearLayout will stack the containing Views either Horizontally or Vertically one after the other. A FrameLayout is simply a container and the items within have to position themselves. RelativeLayout allow you to position your views with a relative reference to other views (in your case, you can position your ImageView, and then your 3 TextViews relative to where the ImageView is).
If you can use LinearLayout instead of RelativeLayout, you should do so, as RelativeLayout is always slower, due to having to perform two passes prior to rendering as it needs to measure each view and then also perform the layouts based on that. You might be looking for something like (pseudo-code):
<LinearLayout orientation=horizontal>
<LinearLayout orientation=vertical>
<TextView />
<TextView />
<TextView />
</LinearLayout>
<ImageView />
</LinearLayout>
You have not described your question well . Check below code if it works .
You just forgot to add orientation in linear layout containing one text view and a Image view .
Add Orientation to Your Linear Layout.
I have just started learning Android. Few confusions I have regarding layouts in XML
Are all views that I define in my layout are essentially inflated or they are optional? Suppose I have two different views in a view-group but I want to
use only first or only second conditionally. Is it possible?
How dynamically created views deal with layout.XML
file?
If I want received messages to be shown in red and sent messages in black how can I do that?
You can include views in the XML layout file that are invisible until you programatically display them. Just use "android:visible="gone" or "android:visible="invisible" in the XML file.
For instance, I include the following in my layout file initially but it's not visible:
<LinearLayout
android:id="#+id/pnlLatLong"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:visibility="gone"
>
<TextView
android:id="#+id/lblLatLng"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lat_long"
/>
<EditText
android:id="#+id/txtLatitude"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="numberDecimal|numberSigned"
/>
<EditText
android:id="#+id/txtLongitude"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="numberDecimal|numberSigned"
/>
</LinearLayout>
In Java code, when the code logic dictates it should be visible, I change the visibility programatically to:
View v = findViewById(R.id.pnlLatLng);
v.setVisibility(View.VISIBLE);
you can set android:visibility="gone" in xml or by code setVisibility(View.gone); for change text color you can set android:text color="#000000" or by code setTextColor();
I am having some spacing trouble when building part of my UI programmatically in Android 4.0. I am trying to add stylized buttons to a stylized LinearLayout. To space the buttons equally, each one is wrapped in a LinearLayout with a weight of 1. I started with a layout defined in XML (somewhat of a proof of concept,) which renders like I expect:
<LinearLayout android:id="#+id/dialog_footer"
android:layout_width="500dp"
android:layout_height="wrap_content"
android:background="#drawable/dialog_footer">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center">
<Button android:id="#+id/cancel"
style="#style/Button"
android:layout_width="130dp"
android:layout_height="38dp"
android:text="Cancel" />
</LinearLayout>
<!-- Another LinearLayout with a nested Button like the one above -->
</LinearLayout>
To add buttons programmatically, I removed the inner LinearLayouts and put them in their own layout file that I can inflate and add to the outer LinearLayout in Java. It is nearly identical.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center" >
<Button android:id="#+id/button"
style="#style/Button"
android:layout_width="130dp"
android:layout_height="38dp" />
</LinearLayout>
And this is roughly how I'm adding buttons in code:
LinearLayout dialogFooter = (LinearLayout)dialogView.findViewById(R.id.dialog_footer);
LinearLayout wrappedButton = (LinearLayout)getLayoutInflater().inflate(R.layout.dialog_button_wrapped, null);
Button button = (Button)wrappedButton.findViewById(R.id.button);
button.setText(R.string.button_one_text);
// button.setOnClickListener(...);
dialogFooter.addView(wrappedButton);
The buttons appear but now they are grouped together and shifted to the left. Is there something Android does when it parses a Layout that I would need to do myself if I'm adding to the dialog_footer? Since weights come into play here, I thought that calling setWeightSum() on the container I'm adding to (dialog_footer) might be necessary but that didn't help. Does anyone have any ideas what might be causing the difference between the XML and Java approaches?
I believe this is your problem:
LinearLayout wrappedButton = (LinearLayout)getLayoutInflater().inflate(R.layout.dialog_button_wrapped, null);
The null should be replaced with the parent view , so that it will get the layoutParams you want to set for it .
Another thing is about the weight you set - you should set the width/height to 0px so that the weight won't cause the layout process work in a weird/inefficient way .
BTW , you can remove the inner layout (that has the button) and use a single button instead. just set the layout_gravity there to center_horizontal .