We try a simple thing. Display a TextView horizontally and vertically centered in a RelativeLayout.
This should be
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</RelativeLayout>
Against all expectations the text appears top left here.
But now add a totally pointless LinearLayout to the whole thing:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- First item in a relative Layout cannot be centered -->
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
>
</LinearLayout>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</RelativeLayout>
and tadaaaa! The text appears where we want him to. You cannot remove any of the lines in the LinearLayout without changing the location of the TextView. It seems RelativeLayout needs some items to be aligned against top/bottom and right/left before you can center any other item.
Similar problem ?
Problem description
I currently have a similar issue with a wrapping RelativeLayout holding a TextView that should be centered due to the use of android:layout_centerInParent="true".
Running my code on an API level 21 device or emulator shows the text properly centered.
However running the same code on API level 19 puts the text view at the top of the wrapping RelativeLayout instead of centered.
Example project
Just for the ease of following I created a sample project at https://github.com/hanscappelle/SO-16731025 Just check out this code from git and import in Android Studio and you should be able to run the code.
Visualisation
You can even test this issue using the design preview in Android Studio by just changing the SDK version for rendering.
Just open the file at layout/with_scrollview.xml and you should get a visualisation of it in the preview in Android Studio.
Using API level 21:
Same layout using API level 19:
Work around
Wrapping ScrollView
As a work around I discovered that removing the wrapping ScrollView solves the problem.
What didn't help
Dummy view
Adding a dummy LinearLayout (or any other view) in between like you suggested didn't resolve my problem.
The example project has this technique applied in the circle at the right of the screen.
Related
I have a little layout working correctly on API 19: 4.2.2 but can't make it work on API 21: 5.0.1.
Here is the layout:
<?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" >
<Button
android:id="#+id/start_button"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textStyle="bold"
android:textSize="30sp"
android:background="#color/start_button_bg"
android:textColor="#color/start_button_text"
android:text="#string/start_process"/>
<TextView
android:id="#+id/pro_icon"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:textColor="#android:color/white"
android:background="#drawable/pro_icon"
android:text="PRO"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceMedium"/>
</RelativeLayout>
Really simple stuff. I just want the textview to be over the Button in the relative layout. I know relative layout stacks views in the order they are added in the xml, but this seems not to be working the same on lollipop. I can't get the TextView to be rendered over the button. Any idea?
Cheers.
A Button has an elevation on Android 5.0+ by default; a TextView does not. The elevation of a widget will basically override the Z-axis ordering set up by a RelativeLayout or a FrameLayout.
Your options are:
Redesign your UI to not have widgets ordered on the Z axis, or
Replace the StateListAnimator on your Button to modify or eliminate the elevation animation, or
Attempt to change the elevation of the TextView, via android:elevation, to be higher than the Button
I have a edittext and a button in a relative layout. Here is the xml:
<?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" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="5sp" >
<Button
android:id="#+id/action_home_button"
android:layout_width="35sp"
android:layout_height="35sp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:background="#drawable/home_button" />
<EditText
android:id="#+id/action_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/action_home_button"
android:focusable="true"
android:focusableInTouchMode="true"
android:hint="Some hint..."
android:textColor="#FFFFFF"
android:textColorHint="#DDDDDD" />
</RelativeLayout>
<ImageView
android:layout_width="match_parent"
android:layout_height="5sp"
android:layout_alignParentBottom="true"
android:background="#EC9D21" />
</RelativeLayout>
The problem is that the button is centered in the RelativeLayout just fine, but my EditText is aligned to the top of the layout. Is there anything that I'm missing? Thank you in advance.
Edit Above I updated my xml. I set this as a custom view of my action bar. But that should not make a difference, since the button has no problem aligning to center vertical. Thanx
Edit EditText should be aligned center vertical
The standard EditTexts in some themes seem to have some built in padding or margin around and/or under it. If you wish to eliminate this issue, then I would heavily suggest either using a nine patch, background color, or some other form of custom background.
Trying to set a negative bottom margin or something crazy might fix the issue for one standard EditText, but you have to be careful between Android versions as their EditTexts can have different themes and give rather unexpected behavior.
As for why the theme designers chose to have this gap underneath is beyond me. My best guess would be that is their way of "saving face" when the developer doesn't add a margin between vertically aligned EditTexts?
+1 for Uxonith. Changing the background seemed to do the trick eg. android:background="#000000". For me this works fine, because I had to change the background anyways, but if you need the standard edit text, this will not be a solution.
I've tried using an HorizontalScrollView with a linearLayout inside. It looked exactly like the picture, but I don't want to use that ScrollView because on the launch, the scrolling bar is shown, and this is not what I want.
I've also tried a relativeLayout with every view aligned with each other, but the last view is scaled down, to fit the small space left.
Any tip?
Try this, You can enable or disable scrolling bar using this setHorizontalScrollBarEnabled()
Scrool.setHorizontalScrollBarEnabled(true)
Gallery is being deprecated. So, the recommended way to achieve this would be HorizontalScrollView. You can turn on/off the scrollbars if you want them not to be shown during launch, and then, after launch turn them on.
This class was deprecated in API level 16. This widget is no longer
supported. Other horizontally scrolling widgets include
HorizontalScrollView and ViewPager from the support library.
Why don't you give a try to andoid Gallery View. That I guess would suffice your need as far as I can visualize it.
Found out a solution:
Created a RelativeLayout with a Horizontal LinearLayout inside. The RelativeLayout (the highest parent) with a width of 1500dp. Then nothing is scalled.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="1500dp"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#ffffffff">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/techinc_splash_1" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/techinc_splash_1" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/techinc_splash_1" />
</LinearLayout>
</RelativeLayout>
I have created a very basic layout:
<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" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
android:drawableStart="#drawable/ic_launcher" />
</LinearLayout>
</RelativeLayout>
According to the documentation for drawableStart,
"The drawable to be drawn to the start of the text."
However, when run on my Android 4.0.4 phone, I instead see this:
Why is there such a large gap between the icon and the text? According to this answer,
"With Android 4.0 (API level 14) you can use android:drawableStart attribute to place a drawable at the start of the text."
But this is not the behavior I observe. Why isn't the attribute working?
A lot of misunderstanding with start and end.
Start and End in layout xml are alternative to left and right to match layout direction (LTR or RTL).
So, when documentation says :
"The drawable to be drawn to the start of the text."
You must read :
"The drawable to be drawn to the beginning of the view according to layout direction"
The reason is because drawableStart kind of makes the button into a compound layout i.e Image view and TextView all wrapped in a 'Button'...
So what you are seeing is that the ImageView is placed in front of the Textview.. However the TextView still has its default layout attributes set so that it draws it centered in the space left for it hence the gap (notice its centered in the space left by putting the Image at the beginning of the text)
so you basically need to override the gravity attribute for the buttons TextView -
android:gravity="center_vertical|center_horizontal|left"
see below notice that you only need to have the button wrapped by 1 layout the other is redundant...
i.e The RelativeLayout could be a LinearLayout on its own too since you only have one view in the layout!
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawableStart="#drawable/ic_launcher"
android:gravity="center_vertical|center_horizontal|left"
android:text="#string/app_name" />
</RelativeLayout>
An app I am working on needs to have two buttons anchored to the bottom of the screen. The technique I've used in the past is to declare a RelativeLayout for the buttons within a parent RelativeLayout (height = fill_parent) and set align_parent_bottom to true. This is declared first and has an id so the next child layout can declare itself to be above the buttons' RelativeLayout.
However, the screen I'm currently working on has a strange problem - there is a large empty gap before the first View object appears:
Here is my layout XML
Can anyone spot where my problem is? Is there a better way to arrange my buttons?
Try this Code , It will work .
Problem is android:layout_above="#id/alarm_details_buttons_layout"
in Scroll View
Edited Code
I checked your code and here is the modification in your buttons layout:
<RelativeLayout
android:id="#+id/alarm_details_buttons_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" >
<Button
android:id="#+id/alarm_details_return_to_list_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="your text here"
android:textSize="15sp" />
<Button
android:id="#+id/alarm_details_update_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/alarm_details_return_to_list_button"
android:state_enabled="false"
android:text="your text here"
android:textSize="15sp" />
</RelativeLayout>
fixed. http://pastebin.com/ucHwzJQP
Note i removed all "#string/", will need to be added back.
I solved the 'gap' problem. As I have set the scroll view to be positioned above the buttons RelativeLayout, I also had to force it to align with it's parent's top:
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_above="#id/alarm_details_buttons_layout"
android:orientation="vertical" >