When centering vertically, how to account for action bar? - android

I'm centering properly, as you can see when you look at the content_main.xml design tab,
However, when you look activity_main.xml design with the action bar in place, while it is still centred in the app, it is not centred within the whitespace, which is what I would prefer. Any suggestions on how to account for the action bar? Preferably in the XML if possible.
Here is my XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/voting_layout"
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:orientation="vertical"
android:layout_gravity="fill_vertical|center"
android:configChanges="orientation|screenSize"
android:screenOrientation="nosensor"
tools:context="com.gesslar.threshvote.MainActivity"
android:background="#color/colorFaded"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main">
<TextView android:id="#+id/textStatusMessage"
android:textColor="#color/colorText"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" />
<ImageButton android:id="#+id/buttonVote"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="false"
android:src="#drawable/ic_vote_button_image"
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:background="#android:color/transparent"
android:scaleType="fitCenter"
android:onClick="onVotePressed"
android:layout_gravity="center_horizontal|center_vertical"
android:adjustViewBounds="true"
android:contentDescription="#string/desc_vote_button" />
<TextSwitcher android:id="#+id/textCountdown"
android:gravity="center"
android:layout_gravity="center_horizontal"
android:textColor="#color/colorText"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textSize="#dimen/countdown"
android:includeFontPadding="false"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ProgressBar android:id="#+id/loadingBar"
style="#style/Widget.AppCompat.ProgressBar"
android:layout_gravity="end"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:visibility="invisible"
android:indeterminate="true"/>
</LinearLayout>

That xml worked for me:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/voting_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="fill_vertical|center"
android:background="#color/colorFaded"
android:configChanges="orientation|screenSize"
android:orientation="vertical"
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:screenOrientation="nosensor"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.gesslar.threshvote.MainActivity"
tools:showIn="#layout/activity_main">
<TextView
android:id="#+id/textStatusMessage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/colorText" />
<ImageButton
android:id="#+id/buttonVote"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:adjustViewBounds="true"
android:background="#android:color/transparent"
android:clickable="false"
android:contentDescription="#string/desc_vote_button"
android:onClick="onVotePressed"
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:scaleType="fitCenter"
android:src="#drawable/ic_vote_button_image" />
<TextSwitcher
android:id="#+id/textCountdown"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/buttonVote"
android:layout_gravity="center_horizontal"
android:gravity="center"
android:includeFontPadding="false"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/colorText"
android:textSize="#dimen/countdown" />
<ProgressBar
android:id="#+id/loadingBar"
style="#style/Widget.AppCompat.ProgressBar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/textCountdown"
android:layout_gravity="end"
android:indeterminate="true"
android:visibility="invisible" />
</RelativeLayout>
But you need to run it on the device or emulator. Android Studio preview shows it wrong. The key line is app:layout_behavior="#string/appbar_scrolling_view_behavior"
EDIT
Also you need to use RelativeLayout - it supports good centering in parent. In LinearLayout you can center image only if your ImageView will be match_parent.

Related

EditText going down screen

Android studio screenshotI have an EditText which I set the width to 0dp but made the weight 1 so that it still spans across the screen and the height is wrap_content but for some reason, it just comes up as a line going right down the screen with no width. Could you please help me to get this right?
<?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.example.user.zidcalculator.MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enter two numbers below and perform an operation to see the output" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="enter first number"/>
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
</RelativeLayout>
<?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"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:layout_alignParentLeft="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enter two numbers below and perform an operation to see the output" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="enter first number"/>
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Your problem is in
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"/>
it should be
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
</LinearLayout>
#Zid
First of all the parent RelativeLayout is not useful in your design
Second of all you was closing your second LinearLayout there only thats why it was giving you issue.
so please check following design code
<?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:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enter two numbers below and perform an operation to see the output" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="enter first number" />
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>

Floating Action Button background graphic not showing (android)

I am attempting to put a FAB on a fragment. The problem is that the background graphic (it is a plus sign) is not showing up in the circle, it just looks like a solid circle of color at the bottom. Here is my layout:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
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_horizontal"
tools:context=".SMS2EmailActivity"
android:background="#drawable/backgroundgradient">
<include layout="#layout/contact_content" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
app:srcCompat="#drawable/plus_circle"
android:tint="#color/tint"
app:elevation="4dp"/>
</android.support.design.widget.CoordinatorLayout>
and the included file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" 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:background="#drawable/backgroundgradient"
android:gravity="center_horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tvInstructions"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"/>
<Button
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/add"
android:id="#+id/btnAdd"
android:layout_below="#id/tvInstructions"
/>
<LinearLayout
android:id="#+id/layoutEmailContactEXLVHeader"
android:layout_width="match_parent"
android:layout_height="30dp"
android:orientation="vertical"
android:layout_marginRight="0px"
android:layout_below="#id/btnAdd">
</LinearLayout>
<ExpandableListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/elvEmailContact"
android:background="#ffffff"
android:cacheColorHint="#00000000"
android:fadeScrollbars="true"
android:scrollbarAlwaysDrawVerticalTrack="false"
android:scrollbarStyle="insideInset"
android:layout_below="#+id/layoutEmailContactEXLVHeader"
android:scrollbarTrackVertical="#drawable/track"
android:divider="#color/black"
android:dividerHeight="1dp"
>
</ExpandableListView>
What am I doing wrong?
I needed to add:
android:src="#drawable/plus_circle
to the FAB layout.

Fragment gets cut off in TabbedActivity

This is the preview in the designer.
But when I run the app on a device (Galaxy S4 with 5.0.1) the bottom part of the fragment gets cut off.
chat_fragment.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="match_parent"
android:orientation="vertical">
<ListView
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stackFromBottom="true"
android:transcriptMode="alwaysScroll"
android:layout_marginBottom="48dip"
android:background="#1b184b"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="48dip"
android:layout_alignParentBottom="true"
android:padding="0dp"
android:layout_margin="0dp"
android:background="#753636"
android:orientation="horizontal">
<EditText
android:layout_width="345dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:hint="Send a message"
android:id="#+id/newmsg"
/>
<ImageButton
android:id="#+id/newmsgsend"
android:src="#drawable/ic_send"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:scaleType="fitEnd"
android:backgroundTintMode="multiply"
android:backgroundTint="#400202" />
</LinearLayout>
</RelativeLayout>
Is this because of something that I should handle from the layout of the fragment?
I changed youx xml code. Just little changes . Use this 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"
android:orientation="vertical">
<ListView
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stackFromBottom="true"
android:transcriptMode="alwaysScroll"
android:background="#1b184b"
android:layout_alignParentTop="true"
android:layout_above="#+id/edit_linear_layout"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="48dip"
android:layout_alignParentBottom="true"
android:padding="0dp"
android:layout_margin="0dp"
android:background="#753636"
android:orientation="horizontal"
android:id="#+id/edit_linear_layout"
>
<EditText
android:layout_width="345dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:hint="Send a message"
android:id="#+id/newmsg"
/>
<ImageButton
android:id="#+id/newmsgsend"
android:src="#drawable/ic_send"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:scaleType="fitEnd"
android:backgroundTintMode="multiply"
android:backgroundTint="#400202" />
</LinearLayout>
</RelativeLayout>
You can add bottom margin to your bottom most item to resolve the "cut off" issue.
android:layout_marginBottom="50dp"
In your case, change your ImageButton to the following
<ImageButton
android:id="#+id/newmsgsend"
android:src="#drawable/ic_send"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:scaleType="fitEnd"
android:backgroundTintMode="multiply"
android:backgroundTint="#400202"
android:layout_marginBottom="50dp" />

TextView does not fit the screen

I have an activity with a TextView. I would like to align it on the bottom of the screen, in the center and I would like that the TextView fits the screen's width.
This is my XML:
<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:background="#ffffff"
tools:context=".ShowCard" >
<TextView
android:id="#+id/textView"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#33000000"
android:textColor="#000000"
android:text="#string/lorem_ipsum" />
The result is not what I have expected to see. The TextView is not full-screen in the width, but leaves a small free space right and left (like padding/border, but I've not set padding/border!).
Do you know why? Suggestions?
try this
<?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" >
<TextView
android:id="#+id/textView"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#33000000"
android:textColor="#000000"
android:text="#string/lorem_ipsum" />
</RelativeLayout>
Excuse me, I'm a stupid guy!
I've not see that in the container XML code were included four padding rows:
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
I've deleted these rows and now everything is working correctly!
Sorry.
<TextView
android:id="#+id/textView"
android:layout_alignParentBottom="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#33000000"
android:textColor="#000000"
android:text="#string/lorem_ipsum" />
Use the 'fill_parent' attribute, it should fill the entire width of the screen.
remove
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
from the parent relative 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"
android:background="#ffffff"
tools:context=".ShowCard" >
<TextView
android:id="#+id/textView"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#33000000"
android:textColor="#000000"
android:text="#string/lorem_ipsum" />
use this

Why android button does align from top edge, but not from bottom edge?

I have a Button, I can align it by the distance from top.
<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:background="#drawable/m1"
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=".OtherScreenActivity1" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="99dp"
android:background="#drawable/btn" />
</RelativeLayout>
But I want to align its position by the distance from bottom, not from top, and it does not work, it stays stick on bottom.
<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:background="#drawable/m1"
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=".OtherScreenActivity1" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="99dp"
android:background="#drawable/btn" />
</RelativeLayout>
Not sure what the problem is but this what I have currently and the code seems to be working properly
<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="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="10dp"
tools:context=".OtherScreenActivity1" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="99dp"
/>
Try this code and see if the xml is what you are looking for.

Categories

Resources