I am having a problem with views overlapping in a RelativeLayout on Android 1.5... Everything is working fine on Android 1.6 and above.
I do understand that Android 1.5 has some issues with RelativeLayout, but I was not able to find anything on StackOverflow or the android beginners group for my specific problem.
My layout consists of four sections, each of which are made up of a TextView, a Gallery, and another TextView aligned vertically:
Running Apps
Recent Apps
Services
Processes
When all four sets of these items are displayed everything works fine. However, my app allows the user to specify that some of these are not displayed. If the user turns off Running Apps, Recent Apps, or Services then the remaining sections all of a sudden overlap eachother.
Here is my code for the layout. I'm not sure what I am doing wrong. When the user turns off display of a section I use the View.GONE visibility setting:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_vertical"
android:layout_gravity="center_vertical"
android:background="#null"
>
<!-- Running Gallery View Items -->
<TextView
style="#style/TitleText"
android:id="#+id/running_gallery_title_text_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:paddingLeft="1sp"
android:paddingRight="10sp"
android:text="#string/running_title"
/>
<Gallery
android:id="#+id/running_gallery_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/running_gallery_title_text_id"
android:spacing="5sp"
android:clipChildren="false"
android:clipToPadding="false"
android:unselectedAlpha=".5"
/>
<TextView
style="#style/SubTitleText"
android:id="#+id/running_gallery_current_text_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/running_gallery_id"
android:gravity="center_horizontal"
/>
<!-- Recent Gallery View Items -->
<TextView
style="#style/TitleText"
android:id="#+id/recent_gallery_title_text_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/running_gallery_current_text_id"
android:gravity="left"
android:paddingLeft="1sp"
android:paddingRight="10sp"
android:text="#string/recent_title"
/>
<Gallery
android:id="#+id/recent_gallery_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/recent_gallery_title_text_id"
android:spacing="5sp"
android:clipChildren="false"
android:clipToPadding="false"
android:unselectedAlpha=".5"
/>
<TextView
style="#style/SubTitleText"
android:id="#+id/recent_gallery_current_text_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/recent_gallery_id"
android:gravity="center_horizontal"
/>
<!-- Service Gallery View Items -->
<TextView
style="#style/TitleText"
android:id="#+id/service_gallery_title_text_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/recent_gallery_current_text_id"
android:gravity="left"
android:paddingLeft="1sp"
android:paddingRight="10sp"
android:text="#string/service_title"
/>
<Gallery
android:id="#+id/service_gallery_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/service_gallery_title_text_id"
android:spacing="5sp"
android:clipChildren="false"
android:clipToPadding="false"
android:unselectedAlpha=".5"
/>
<TextView
style="#style/SubTitleText"
android:id="#+id/service_gallery_current_text_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/service_gallery_id"
android:gravity="center_horizontal"
/>
</RelativeLayout>
I ommitted the xml for the Processes section in a (somewhat vain) attempt to keep this shorter...
What can I do to make this work in Android 1.5? I don't think it is just a matter of reordering the views in the xml because it works fine when everything is displayed.
Two possible solutions:
Try setting the element's height to 0 or 1 px and visibility to INVISIBLE instead of GONE.
Wrap each Gallery/TextView in a LinearLayout set to wrap_height, and set the above/belows on the layouts instead of the subviews. Then set the subelements to View.GONE, leaving the linear layouts used for the relative positioning still visible but with wrapped height 0.
The idea with either solution is to make sure you're never positioning something relative to a view that's View.GONE; I'd suspect that's the source of the bug you're running into.
If I may ask, though... why do you even need to use a RelativeLayout here at all? From what I can see at a glance, everything here would fit fine into a vertical LinearLayout, and in fact seems to be conceptually simpler for this arrangement.
Related
What the cause of this design view error in Android Studio?
Exception raised during rendering: mBaselineAlignedChildIndex of LinearLayout points to a View that doesn't know how to get its baseline.
Here's the layout:
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/mainListView"
android:orientation="vertical">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/bg_btn_btm_actionbar"
android:src="#mipmap/ab_solid_example"/>
<ListView
android:id="#+id/eventStates"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:background="#drawable/listviewimg"
android:drawSelectorOnTop="true"
android:footerDividersEnabled="true"
android:headerDividersEnabled="true"
android:textColor="#000000" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/btn_cancel_callresult"
android:layout_width="153dp"
android:layout_height="wrap_content"
android:layout_gravity="bottom" android:layout_marginRight="#dimen/abc_action_bar_default_padding_material"
android:background="#color/white"
android:onClick="cancelCallResult"
android:text="Cancel"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/white" />
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
Just had this same error. Baseline-alignment has to do with the parent LinearLayout determining the baseline of each child, and specifically, the last child in the layout. My issue involved a TimePicker - in API 21+, it's a graphical clock, so there are no TextViews to provide baseline information.
Here, the problem is in lines 27-35:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/btn_cancel_callresult"
android:layout_width="153dp"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
You're missing an "android:orientation=vertical" (or horizontal) on this inner LinearLayout around the Button, and the Button itself specifies a gravity within its parent ("linear-gravity") of "bottom". There's no orientation or height specified for any of it, so the outer LinearLayout doesn't know how to determine a baseline for it.
Also, that inner LinearLayout is unnecessary as-is. If you want an empty space between the List and the Button, try using a Space widget, or if you want the List to fill the space all the way to the Button, give the List a weight attribute ("layout-weight=1.0").
I know this is old but for people who run into this problem, this is a known bug, lookup "Issue 214062".
It has been resolved in API 24.
It is only a problem on the Android Studio preview tab, not on the actual emulator or device, when TimePicker visibility is gone.
To fix this issue, use tools namespace as quickfix, so that at least you'll be able to see the preview, while still being hidden on a device, like so:
<TimePicker
android:id="#+id/timerpicker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
tools:visibility="visible"
/>
I am new to android programming and am trying to understand the android architecture and how are applications built around it.
So there is no real world need for this as of now. Its just some experimentation that I am doing to learn the stuff. What I want here is 3 different views, TextView, EditText and Button, horizontally next to each other. To achieve this here's the activity_main.xml that I am using : -
<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: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=".MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
<EditText android:id="#+id/edit_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/edit_message" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/text_to_appear_on_button" />
</LinearLayout>
On running the MainActivity.java, that has setContentView(R.layout.activity_main);, in the onCreate(), I get the TextView and the EditText widgets on the screen, horizontally next to one another, but not the Button. I wonder why ?
And strangely I have observed that the last element inside
<LinearLayout>..</LinearLayout>
is the one that gets vanished from the screen. So if <Button .. /> is exchanged with say <TextView .. />then its the <TextView> element that will not be visible on the screen now.
Please explain what am I missing out here.
I am running the MainActivity.java on the emulator and am using Eclipse as my IDE, if this information helps further.
It depends on what you want to do. If you want three things horizontally in a LinearLayout, you will likely run out of space on the screen. To guarantee that all three fit, set:
android:layout_width="match_parent"
android:layout_weight="1"
For all 3. You can mess around with the weight as you see fit, but basically this will tell the rendering to fit all three objects on the screen horizontally, each one taking up 1/3 of the screen (if you change weight, it will be different values).
If using LinearLayout, you will probably nest multiple layouts, with a main vertical LinearLayout containing several horizontal ones. It is a valid approach, and is probably a matter of preference. LinearLayout allow for weights, which can be extremely useful because they are one way of guaranteeing things don't get cut off the screen.
RelativeLayout is another approach, wherein you specify where things on the screen are relative to each other (Left, Right, Above, Below). While these don't use weights, you can align elements with the edges of the screen and get the same effect.
As I said, the approach is largely a matter of preference, and usually some mesh of both works pretty well.
I recommend to you use relative layout for your xml ,If you use linear your widgets are assigned one by one,not your wish.its for your further developement
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="101dp"
android:layout_marginTop="50dp"
android:text="TextView" />
<EditText
android:id="#+id/editText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView1"
android:layout_below="#+id/textView1"
android:layout_marginTop="67dp"
android:ems="10" >
<requestFocus />
</EditText>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/editText1"
android:layout_below="#+id/editText1"
android:layout_marginTop="59dp"
android:text="Button" />
</RelativeLayout>
I have a layout with 4 buttons (which I am trying to get of equal size). The problem is I don't want the text on my first button to be ellipsized. I have tried many things: setting the ellipsize attribute to "none", setting the singleLine attribute to false, cutting off the paddings, none of them worked.
Everything looks fine in eclipse graphical layout, but when I try it on a real device, the said issue occurs, no matter how large the screen is.
At first, I thought it was because the paddings ( I define a custom background for the button in an .xml and I use paddings on that shape). However, removing them did not work.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:gravity="center"
android:background="#drawable/gradient_bkg"
tools:context=".StartActivity" >
<TableLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TableRow android:layout_weight="1.0">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:gravity="center">
<Button
android:id="#+id/random_words"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="15dp"
android:layout_weight="1.0"
android:background="#drawable/button_sexy"
android:text="Random two words"
android:drawableLeft="#drawable/drinks"/>
<Button
android:id="#+id/no_data"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="15dp"
android:layout_weight="1.0"
android:background="#drawable/button_sexy"
android:text="No data"
android:drawableLeft="#drawable/body_data" />
</LinearLayout></TableRow>
<TableRow android:layout_weight="1">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:gravity="center" >
<Button
android:id="#+id/result"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="15dp"
android:layout_weight="1"
android:background="#drawable/button_sexy"
android:text="Result"
android:drawableLeft="#drawable/results" />
<Button
android:id="#+id/reset"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="15dp"
android:layout_weight="1"
android:background="#drawable/button_sexy"
android:text="Reset"
android:drawableLeft="#drawable/reset"/>
</LinearLayout>
</TableRow>
</TableLayout>
</RelativeLayout>
Your code is amazing and perfect. The problem you indicated will occur only for lower APIs, because you added a Theme.Holo in your manifest, which acts strange for older APIs.
Simplest solution, since you are using a custom LAF anyway, : replace Theme.Holo with Theme.Black in your manifest.
I think the problem is related to the usage of wrap_content on so many levels of your layout. I have seen that this causes the individual items trying to be smart sometimes and are auto adjusting incorrectly or at leas in an unexpected way. Try to put your buttons on top level layout to test if you can get the correct behaviour when using match_parent instead.
But in the end, playing around with combinations of wrap_content and match_parent can consume quite lot of time. A fast way forward may be to set the buttons to fixed size, but then please make sure you set them somewhat bigger than you think is enough to make sure it will work on many different screen sizes.
I use the following main.xml code but I can only see one edit text box
I need help regarding why does this occur? I have tried many times but I cannot see proper edit box and all other components
<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"
tools:context=".MainActivity" >
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="ENTER THE PHONE NUMBER HERE" />
<EditText
android:id="#+id/txtPhoneNo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Message"
/>
<EditText
android:id="#+id/txtMessage"
android:layout_width="fill_parent"
android:layout_height="150dp"
android:gravity="top"
/>
<Button
android:id="#+id/btnSendSMS"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Send SMS"
/>
This is because you haven't set an orientation for your LinearLayout and the default is horizontal. Since you have all of your views width set to fill_parent, there is no room for the others
You have a couple options. You can either set
android:orientation="vertical"
in your root LinearLayout or you can change the width of these views
android:layout_width="wrap_content"
There are other ways too, obviously, but these are the easiest fixes for what you have
LinearLayout Docs
Also Note:
FILL_PARENT (renamed MATCH_PARENT in API Level 8 and higher), which means that the view wants to be as big as its parent (minus padding)
Layout Params
Side Note
I see you are using hard-coded strings in your xml. Eclipse will warn you about this and it may give you headaches in the future if you don't get accustomed to using the strings.xml folder and using the android:text="#string/string_name"
Strings
On your LinearLayout check the orientation=vertical
I'm having a problem with a LinearLayout in an app i'm working on. The linear layout is vertical. There are several items in the layout including a TextView, a vertical SeekBar, and an ImageView.
Whenever I update the textView (ie setText()) my layout rearranges. The ImageView goes from being at the bottom to being in the middle. Same thing happens if I replace the drawable in the ImageView.
I assume I have something wrong with how I am specifying my layout. This is the portion having problems:
<modrobotics.code.ui.BlockValueSliderView
android:id="#+id/sliderSix"
android:layout_width="0dp"
android:visibility="gone"
android:layout_height="fill_parent"
android:layout_marginBottom="-12dp"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/BVLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center_horizontal"
android:paddingTop="12dp"
android:text="64"
android:textColor="#000"
android:textSize="20sp" >
</TextView>
<View
android:id="#+id/circle1"
android:layout_width="6dp"
android:layout_height="6dp"
android:layout_gravity="center"
android:layout_marginBottom="-6dp"
android:background="#drawable/circle"
android:gravity="center_horizontal"
android:padding="0dp" />
<LinearLayout
android:id="#+id/controlElementList12"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:padding="0dp" >
<modrobotics.code.ui.VerticalSeekBar
android:id="#+id/slider"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="bottom|center_horizontal"
android:layout_marginBottom="-20dp"
android:layout_weight="20"
android:padding="0dp"
android:progressDrawable="#drawable/seekbar_progress"
android:thumb="#drawable/seekbar_thumb"
android:thumbOffset="-1dp" />
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="-20dp"
android:layout_marginTop="-20dp"
android:layout_weight="1"
android:padding="0dp"
android:src="#drawable/on6" >
</ImageView>
</LinearLayout>
</modrobotics.code.ui.BlockValueSliderView>
EDIT:
I have tried the suggestions mentioned below to no avail. I have removed all negative margins, simplified the layout by removing unnecessary LinearLayout, gotten rid of GONE, fixed height for images etc... I'm starting to believe the problem is greater than just this.
I'm using a single Activity with a PageAdapter. It seems I'm not using PageAdapter correctly. startUpdate() is being called over and over again. Any static global variables I have seem be cleaned up or on separate threads some how. I believe these problems may all be linked. Perhaps I don't full understand the threading model when using a PageAdapter.
In 'modrobotics.code.ui.BlockValueSliderView' change the visiblity from GONE to INVISIBLE. It's possible that the layout elements will re-arrange whenever you change the visibility programatically from GONE to VISIBLE of this View because while the View is set to be GONE, it doesn't occupy any space in the layout and rest of the Views are placed in the layout just taking its space. If it's GONE, It behaves like it doesn't exist in the layout. Then, when you sets this view to be VISIBLE, it switches rest of the Views in the layout to prepare a space for itslef.
This turned out to be a problem related to the VerticalSeekBar implementation I was using.
I was rotating the thumb for the seekbar, and also calling bringToFront() on the seekbar. The combination of these two calls caused elements to be rearranged. Not to sure why, but removing these two lines of code fixed my problems.