I have the Layouts as you can see in the picture (sorry I cannot post them normally yet):
https://dl.dropboxusercontent.com/u/28640502/Unbenannt.bmp
However, when I execute the app I can only see the camera preview and not the text nor the SeekBar. I know they work, because when I reduce the size of the camera I can see them and interact, but if I want the camera to be like background and then the children over it, it doesn't work.
I have been checking a lot of threads with similar problems but I don't find the solution:
1, 2, 3... Any idea? Thanks a lot!
Here is my xml code just in case:
<?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:layout_weight="0.55"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/camera_preview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="fill">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/show_height"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5sp"
android:layout_marginRight="10sp"
android:layout_weight="0.12"
android:text="H" />
<SeekBar
android:id="#+id/select_height"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_margin="5sp"
android:layout_weight="0.91" />
<TextView
android:id="#+id/show_distance"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.06"
android:text="Dist" />
</LinearLayout>
</FrameLayout>
</LinearLayout>
try to input both of your layouts in relative layout for example
<LL>
<RL>
<FL>
</FL>
<LL>
</LL>
</RL>
</LL>
this is hapenning because of overlaiyng of LL by FL
You could use the bringToFront() method of the View class.
SeekBar seeker = (SeekBar)findViewById(R.id.select_height);
seeker.bringToFront();
Alernatively you could use the sendToBack() function to put a view behind other views.
Also remember that a view's z-index is determined by the order in which the view is declared in the xml layout file.
I'd also suggest changing the camera preview layout and it's first child layout to be siblings. The one added last in the xml file will be on top.
Related
Recently picking up android development, I have hit a snag in the road. I'm having trouble positioning my layouts. Screenshots are as follows:
I'm trying to input either another layout type/list view in the upper section of the screen, without disrupting the button/text box at the bottom, though.. When extending this layout. I hit the following snag:
The entire contents of the original frame shift when the box of the new layout is extended, I've tried modifying:
android:layout_gravity="top">
and other layout attributes such as weight, margin, height/width.. This always hits the same problem.
My XML for this view is:
<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="horizontal" >
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="483dp"
android:layout_weight="1.06"
android:layout_gravity="top">
</FrameLayout>
<EditText android:id="#+id/edit_message"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="#string/edit_message"
android:layout_gravity="bottom" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send"
android:layout_gravity="bottom"
android:onClick="SendMessageButton"
/>
</LinearLayout>
Though, i'm some-what stuck on how to make the correct changes & any response to this question would be greatly appreciated!
At the moment, all your child views live inside a single horizontally-oriented LinearLayout. LinearLayouts always arrange views sequentially, as you are experiencing.
There are a couple different ways to achieve the layout you are looking for. I'm going to suggest one that uses nested LinearLayouts (an outer one to stack things vertically, and then a nested one to arrange the EditText and Button horizontally), but you could also consider using a RelativeLayout for this.
Updated layout:
<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">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="#+id/edit_message"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="#string/edit_message" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send"
android:onClick="SendMessageButton" />
</LinearLayout>
</LinearLayout>
Note that a LinearLayout is oriented horizontally by default; I have explicitly included the attribute here to make the structure more clear.
The reason, your button and editText is appearing far from the frame layout and not near the corner is the parent layout orientation is Horizontal.
Change it to Vertical.
Now, if you need your button and editText to be arranged in the same line, it should be mentioned as described in samgak answer.
However, i would like to suggest the following.
Using framelayout might create bad user experience across different screen sizes in android.
If the parent layout in Linear, if the screen size is x and all your components added if the height it takes is x-20, then the theme you set for parent layout would not cover the entire screen. Therefore, it is recommended to use RelativeLayout and for the button and editText, use the layout_alignParentBottom = true attribute.
If needed, i can share the code sample for this. Added Vertical Scroll to the layout.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="483dp"
android:layout_gravity="top">
</FrameLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<EditText android:id="#+id/edit_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="Edit Message"
android:layout_gravity="bottom" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Send"
android:layout_gravity="bottom"
android:onClick="SendMessageButton"
/>
</LinearLayout>
</LinearLayout>
</ScrollView>
I have a layout something like this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:background="#ff303f"
android:id="#+id/layout">
<ImageView
android:id="#+id/picture"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_centerInParent="true"/>
<Button
android:id="#+id/cancel"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_alignRight="#id/picture"
android:background="#drawable/cross_out"/>
</RelativeLayout>
I inflate it using the usual layout inflator service, set up some functionality to the button and an image to the imageview (all images are of same size and aspect ratio).
After that, I add this view to my fragment's layout which is nothing but a ScrollView which is a parent, it has a child linear layout that I call 'map' and simply add it to the map.
Expected : The added layouts should get added properly and I can scroll through it.
Actual : If more than 2 are added, the first one gets eaten up. I can see it half or sometimes it is completely eaten up. :\
Any idea whats going on here? Thanks a lot for your time.
EDIT:
Here's the layout file I add the inflated layout into:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f6ff45">
<LinearLayout
android:id="#+id/map"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#43ff44"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_gravity="center"
android:layout_marginTop="15dp">
</LinearLayout>
</ScrollView>
I also forgot to mention that after adding 3 or more of these layouts, I realized there's unnecessary empty space in the end. :\
If you have some android:layout_gravity or gravity property in your ScrollView, that may be the reason. Try deleting it, or make it center_horizontal.
Try this code for your layout file;
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f6ff45">
<LinearLayout
android:id="#+id/map"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#43ff44"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_gravity="center"
android:layout_marginTop="15dp">
</LinearLayout>
</ScrollView>
As I mentioned before, android:layout_gravity="center"in this LinearLayout causes this problem. Because it doesn't only horizontally center but also verticelly center the contents. It means when they are longer than the available height, the center part will appear. I only changed it into android:layout_gravity="center_horizontal" and the problem is fixed.
So, I have this one activity that looks like this:
http://i.imgur.com/UzexgEA.jpg
As you can see, it has a button, a list and a button.
If certain conditions are met, I want to hide both buttons just show the list, but as you can see in the next image, the buttons are still taking up space:
http://i.imgur.com/OyLIfSk.jpg
So my question, what can I do to enlarge the list to take that space out?
Here is my layout for the buttons and the list:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Button
android:id="#+id/findSelected"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:onClick="registrarAsistencia"
android:text="Registrar Asistencia" />
<ListView
android:id="#+id/listaAlumnos"
android:layout_width="fill_parent"
android:layout_height="376dp"
android:layout_weight="2.29" />
<Button
android:id="#+id/btnChecarBoxes"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:onClick="seleccionarTodosNinguno"
android:text="Seleccionar / Deseleccionar todo" />
</LinearLayout>
And here it is the layout for the list's contents:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:orientation="vertical" >
<TextView
android:id="#+id/rowTextView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:padding="10dp"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:id="#+id/rowTextView2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:padding="10dp"
android:textSize="16sp"
android:textStyle="italic"/>
</LinearLayout>
<CheckBox
android:id="#+id/CheckBox01"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:focusable="false"
android:padding="10dp" />
</RelativeLayout>
Do not make the buttons View.INVISIBLE. Make the buttons View.GONE. There are three visibility states:
visible (normal)
invisible (pixels not drawn, but still takes up space)
gone (not included in rendering)
In the java code
yourView.setVisibility(View.GONE);
and in the XML code
android:visibility="gone"
Thier are 3 state
visible: normal
invisible : takes space and invisible
gone : no space and no visibility
Use
android:layout_height="0dp"
android:layout_weight="1"
In addition to #CommonsWare's answer
You should use a layout that fits well in all screen sizes. If you give you layout a fixed height like android:layout_height="376dp" it will look good only on the device (or emulator) you're testing on. What you have to do is to make sure that your listview takes up all (and only) the space left by your buttons.
Check out this article and this answer to better understand layout weights.
for hiding your widget
yourEditText.setVisibility(View.GONE)
for visbility of your widget
yourEditText.setVisibility(View.VISIBLE)
I want to create an application that have 5 buttons in bottom of page, when user clicks
on the any button, the page will changes but 5buttons remain in bottom of page. now i create
this program but when i call setContentView() in other class becuase i call other layout,
buttons removed. have ways for remain 5buttons? or i should create 5buttons again in 5layout?
Thanks
Cheers
Easiest and Simple way is to make a layout having 5 buttons and it in all your layout files
Example
<include layout="#layout/titlebar"/>
Or another way is to use fragments so tht only fragments with change keeping other of your layout stuff same
Edit
OR Use the <merge> Tag
The <merge /> tag helps eliminate redundant view groups in your view hierarchy when including one layout within another. For example, if your main layout is a vertical LinearLayout in which two consecutive views can be re-used in multiple layouts, then the re-usable layout in which you place the two views requires its own root view. However, using another LinearLayout as the root for the re-usable layout would result in a vertical LinearLayout inside a vertical LinearLayout. The nested LinearLayout serves no real purpose other than to slow down your UI performance.
To avoid including such a redundant view group, you can instead use the element as the root view for the re-usable layout. For example:
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/add"/>
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/delete"/>
</merge>
Now, when you include this layout in another layout (using the tag), the system ignores the element and places the two buttons directly in the layout, in place of the tag.
Please go through this link to gain more information about Reusing layouts
From what I can gather, I think you are looking for tabs instead of Buttons. Take a look at this.
Thanks for answer. I read developer link and i add merge and include tag to xml file but the program has errors. Why?
MainActivity.xml
<?xml version="1.0" encoding="utf-8"?>
<include layout="#layout/location"/>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<WebView
android:id="#+id/web_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.0" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/background"
android:gravity="bottom"
android:orientation="horizontal" >
<Button
android:id="#+id/button_home"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/home_icon"
android:text="#string/button_home"
android:textColor="#color/text_home" />
<Button
android:id="#+id/button_product"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/product_icon"
android:onClick="Product"
android:text="#string/button_product"
android:textColor="#color/text_product" />
<Button
android:id="#+id/button_places"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/places_icon"
android:onClick="Places"
android:text="#string/button_places"
android:textColor="#color/text_places" />
<Button
android:id="#+id/button_rewards"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/rewards_icon"
android:onClick="Rewards"
android:text="#string/button_rewards"
android:textColor="#color/text_rewards" />
<Button
android:id="#+id/button_more"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/more_icon"
android:onClick="More"
android:text="#string/button_more"
android:textColor="#color/text_more" />
</LinearLayout>
</LinearLayout>
location.xml
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView>
<com.google.android.maps.MapView
android:id="#+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:apiKey="0cPRv243zM1_S3ydsNg8MJP9_6BfCp642jOhPvQ"/>
<LinearLayout
android:id="#+id/zoom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</LinearLayout>
</merge>
what is incorrect?
Thank you
I have made myself a custom LinearLayout by the name of com.theflyingnerd.DroidMe.DiscreteNumericalRangeSelectorWidget that hosts a couple of spinner widgets. This custom LinearLayout inflates the following XML layout (You might not need to look at this too carefully but it's here for completeness):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<!-- Min value Spinner -->
<Spinner
android:id="#+id/discrete_numerical_range_selector_min_value_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:layout_weight="1" />
<TextView
android:id="#+id/to_text"
android:text="to"
android:textSize="14sp"
android:paddingLeft="10sp"
android:paddingRight="10sp"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_weight="0">
</TextView>
<!-- Max value Spinner -->
<Spinner
android:id="#+id/discrete_numerical_range_selector_max_value_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_weight="1" />
I have placed one such object in the layout for one of my activities like so:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<include layout="#layout/search_form_section_generic_top"/>
<include layout="#layout/search_form_section_car_specific"/>
<com.theflyingnerd.DroidMe.DiscreteNumericalRangeSelectorWidget/>
<include layout="#layout/search_form_section_advanced_options" />
</LinearLayout>
The problem is that my app force closes immediately upon startup. I've checked by putting breakpoints in my custom LinearLayout that none of my custom code is even being run yet. Furthermore, if I copy-paste the layout code for my compound widget in place everything works, which indicates to me that I probably haven't left any important XML attributes out. What could be going wrong?
I fixed it by making the LinearLayout XML element in the widget layout into a merge instead, and moved all of the layout parameters out of the widget XML file and into the activity XML itself, thus replacing
<com.theflyingnerd.DroidMe.DiscreteNumericalRangeSelectorWidget/>
with
<com.theflyingnerd.DroidMe.DiscreteNumericalRangeSelectorWidget
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
If someone could tell me why this worked, it might help me and others doing it again, and you can take credit.
because you must specify the width and height of every view you use in you xml?