Android studio horizontal layout troubles - android

So, I'm trying to get something like this.
And I am having a problem lining up the + and - buttons in the same line.
Once I have the horizontal layout, and I drag the buttons. I end up with this. I don't know how to make it work, from code or design window. Please help.
Any solution?
<?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:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="#layout/activity_main">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginTop="0dp"
android:orientation="horizontal">
<Button
android:id="#+id/suma"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="171dp"
android:layout_weight="1"
android:onClick="incrementaContador"
android:text="+" />
<Button
android:id="#+id/resta"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="169dp"
android:layout_weight="1"
android:onClick="restaContador"
android:text="-" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:orientation="vertical">
<TextView
android:id="#+id/titulo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp"
android:text="Cafe del dia "
android:textAlignment="center" />
<TextView
android:id="#+id/contadorA"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="64dp"
android:textAlignment="center"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
<Button
android:id="#+id/reinicio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Reinicio"
android:onClick="reseteaContador" />
</RelativeLayout>


I think you need something like this. Paste this code in your code window.
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:id="#+id/titulo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="40dp"
android:text="Cafe del dia " />
<TextView
android:id="#+id/contadorA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/titulo"
android:layout_centerHorizontal="true"
android:layout_marginTop="16dp"
android:text="4"
android:textSize="24sp"
android:textStyle="bold" />
<LinearLayout
android:id="#+id/button_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/contadorA"
android:layout_centerHorizontal="true"
android:layout_marginTop="60dp"
android:orientation="horizontal">
<Button
android:id="#+id/suma"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="16dp"
android:onClick="incrementaContador"
android:text="+"
android:textSize="30sp" />
<Button
android:id="#+id/resta"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_margin="16dp"
android:onClick="restaContador"
android:text="-"
android:textSize="30sp"
android:textStyle="bold" />
</LinearLayout>
<Button
android:id="#+id/reinicio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="40dp"
android:onClick="reseteaContador"
android:text="Reinicio" />
</RelativeLayout>
From my point of view, it is easier to get appropriate design by coding it. I am having something like this.


You've got
android:layout_alignParentTop="true"
android:layout_marginTop="171dp"
on one button and
android:layout_alignParentTop="true"
android:layout_marginBottom="169dp"
on the other.
Try this:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="#layout/activity_main">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:orientation="horizontal">
<Button
android:id="#+id/suma"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:onClick="incrementaContador"
android:text="+" />
<Button
android:id="#+id/resta"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:onClick="restaContador"
android:text="-" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:orientation="vertical">
<TextView
android:id="#+id/titulo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:text="Cafe del dia "
android:textAlignment="center" />
<TextView
android:id="#+id/contadorA"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="64dp"
android:textAlignment="center"
android:textSize="24sp"
android:textStyle="bold" />
</LinearLayout>
<Button
android:id="#+id/reinicio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Reinicio"
android:onClick="reseteaContador"
/>
</RelativeLayout>


You have too many nested views. You could just use a vertical Linear Layout as parent viewgroup and a horizontal linear layout with layout weight 1 for the middle two buttons.
For example:
<?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">
<TextView
android:id="#+id/titulo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:text="Cafe del dia "
android:textAlignment="center" />
<TextView
android:id="#+id/contadorA"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:textAlignment="center"
android:textSize="24sp"
android:text="24"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:gravity="center"
android:layout_weight="1">
<Button
android:id="#+id/suma"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="30dp"
android:onClick="incrementaContador"
android:text="+" />
<Button
android:id="#+id/resta"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="restaContador"
android:text="-" />
</LinearLayout>
<Button
android:id="#+id/reinicio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Reinicio"
android:onClick="reseteaContador" />
</LinearLayout>
Best if you use constraintLayout once you learn to use it.


You should instead use a ConstraintLayout to achieve what you want. It will be more efficient than using a RelativeLayout, especially nesting sub-layouts inside it. With the ConstraintLayout, you can use the GUI builder to drag the elements around the screen and get them pixel-perfect. The ConstraintLayout may require a bit of work but it is really powerful and you can get major performance gains when you have complex Viewgroup hierarchies consisting of many nested ViewGroups.
But as a solution to your problem here is the updated code:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="#layout/activity_main">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="horizontal">
<Button
android:id="#+id/suma"
android:layout_width="75dp"
android:layout_height="75dp"
android:layout_marginRight="15dp"
android:onClick="incrementaContador"
android:textSize="35sp"
android:text="+" />
<Button
android:id="#+id/resta"
android:layout_width="75dp"
android:layout_height="75dp"
android:layout_marginLeft="15dp"
android:onClick="restaContador"
android:textSize="35sp"
android:text="-" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:orientation="vertical">
<TextView
android:id="#+id/titulo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="30sp"
android:text="Contender"
android:textAlignment="center" />
<TextView
android:id="#+id/contadorA"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="center"
android:textSize="35sp"
android:text="4"
android:textStyle="bold" />
</LinearLayout>
<Button
android:id="#+id/reinicio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:layout_centerInParent="true"
android:layout_alignParentBottom="true"
android:onClick="reseteaContador"
android:text="Reinicio"
/>
</RelativeLayout>


See on the picture the property that will put text box below the button.
Then you get the squigly line in red circle indicating the relation.
How to space it even further down the page, I'm still working on. (you could use padding, but I'm sure there is better solution)
click

Related

Recyclerview items text look different on different devices

I am working on an activity that has three recyclerviews.
My issue is that the output is different on different devices.
I am testing the app on my real device and on the Android Studio emulators, and the output is right. But I have some customers users who say that the output is wrong.
Here is my screen shot with the right output:
And this is the wrong output on some devices:
I have tried changing text size, but with no success.
I ask you where should I start looking for a solution, at recyclerview or at item view?
EDIT
Activity Layout:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f2f2f2">
<LinearLayout
android:id="#+id/cabeceraTicket"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/cardview_dark_background"
android:orientation="horizontal">
<TextView
android:id="#+id/txtTicket"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:text="Ticket: "
android:textColor="#color/cardview_light_background"
android:textSize="18sp" />
<TextView
android:id="#+id/txtSalon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:text="Salón: "
android:textColor="#color/cardview_light_background"
android:textSize="18sp" />
<TextView
android:id="#+id/txtMesa"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:text="Mesa:"
android:textColor="#color/cardview_light_background"
android:textSize="18sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/botones"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/cabeceraTicket"
android:orientation="horizontal">
<Button
android:id="#+id/btnTodo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Menu/Ticket" />
<Button
android:id="#+id/btnMenu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Menu" />
<Button
android:id="#+id/btnTicket"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Ticket" />
</LinearLayout>
<LinearLayout
android:id="#+id/botones2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/botones"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:id="#+id/btnRegresar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#009688"
android:text="Salir"
android:textColor="#color/white" />
<Button
android:id="#+id/btnMarchar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#3F51B5"
android:text="Marchar todo"
android:textColor="#color/white" />
</LinearLayout>
<Button
android:id="#+id/btnConectar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:visibility="gone" />
<LinearLayout
android:id="#+id/menus"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/botones2"
android:orientation="vertical">
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="Menú"
android:textSize="24sp"
android:textStyle="bold" />
<LinearLayout
android:id="#+id/lmenu1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/l0"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_previous" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerViewMenu0"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="10"
android:orientation="horizontal">
</android.support.v7.widget.RecyclerView>
<ImageView
android:id="#+id/r0"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_next" />
</LinearLayout>
<LinearLayout
android:id="#+id/lmenu2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:visibility="visible">
<ImageView
android:id="#+id/l1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_previous" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerViewMenu1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="10"
android:orientation="horizontal">
</android.support.v7.widget.RecyclerView>
<ImageView
android:id="#+id/r1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_next" />
</LinearLayout>
<LinearLayout
android:id="#+id/lmenu3"
android:layout_width="match_parent"
android:layout_height="80dp"
android:orientation="horizontal"
android:visibility="visible">
<ImageView
android:id="#+id/l2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_previous" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerViewArticulos1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="10"
android:orientation="horizontal">
</android.support.v7.widget.RecyclerView>
<ImageView
android:id="#+id/r2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:src="#android:drawable/ic_media_next" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/ticket"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/menus"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/titulo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/textView4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="Ticket"
android:textSize="24sp"
android:textStyle="bold" />
<ListView
android:id="#+id/listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/titulo"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:listSelector="#drawable/list_selector"
android:state_activated="true" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
First recyclerview item layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_margin="1dp">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
app:cardCornerRadius="4dp"
app:cardElevation="1dp"
app:cardMaxElevation="2dp">
<RelativeLayout
android:id="#+id/relative"
android:layout_width="120dp"
android:layout_height="50dp"
android:gravity="center_horizontal|center_vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:id="#+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:layout_weight="4"
android:autoSizeMaxTextSize="15sp"
android:autoSizeMinTextSize="8sp"
android:autoSizeTextType="uniform"
android:gravity="center|center_horizontal|center_vertical"
android:padding="12dp"
android:text="Canada"
android:textAllCaps="false"
android:textColor="#color/red_A700"
android:textSize="30sp"
android:textStyle="bold"
app:autoSizeMinTextSize="20sp"
app:fontFamily="sans-serif" />
</LinearLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
Second recyclerview item layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_margin="1dp">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
app:cardCornerRadius="4dp"
app:cardElevation="1dp"
app:cardMaxElevation="2dp">
<RelativeLayout
android:id="#+id/relative"
android:layout_width="120dp"
android:layout_height="50dp"
android:gravity="center_horizontal|center_vertical">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:autoSizeMaxTextSize="15sp"
android:autoSizeMinTextSize="8sp"
android:autoSizeTextType="uniform"
android:gravity="center|center_horizontal|center_vertical"
android:padding="12dp"
android:text="Canada"
android:textAllCaps="false"
android:textColor="#color/red_A700"
android:textSize="30sp"
android:textStyle="bold"
app:autoSizeMinTextSize="20sp"
app:fontFamily="sans-serif" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
Third recyclerview item layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_margin="1dp">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
app:cardCornerRadius="4dp"
app:cardElevation="1dp"
app:cardMaxElevation="2dp">
<RelativeLayout
android:id="#+id/relative"
android:layout_width="120dp"
android:layout_height="50dp"
android:gravity="center_horizontal|center_vertical">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:autoSizeMaxTextSize="15sp"
android:autoSizeMinTextSize="8sp"
android:autoSizeTextType="uniform"
android:gravity="center|center_horizontal|center_vertical"
android:padding="12dp"
android:text="Canada"
android:textAllCaps="false"
android:textColor="#color/red_A700"
android:textSize="30sp"
android:textStyle="bold"
app:autoSizeMinTextSize="20sp" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>

your code contain like this,
<RelativeLayout
android:id="#+id/relative"
android:layout_width="120dp"
android:layout_height="50dp"
android:gravity="center_horizontal|center_vertical"></>
you need to change the item layout fixed length width

I would suggest not to set values for the textsize in your xml at all (either in dp or sp). Let each user choose their preferred textSize by changing the system-wide font size in the device's Settings--->Display--->FontSize.
Just make sure any container for these textViews (the parent layout of each textView) can accommodate textViews of varying sizes. One way this can be accomplished, is by setting the container's width and height values to 'WrapContent' if possible.
My answer should be viewed like a shift in your approach to text sizes in general, rather than a specific answer to a specific problem like the one you are facing. There may well be easier and faster solutions if you just want to quick-fix your current issue.

Format issue placing two views side by side in RelativeLayout

I have two views side by side inside a relative layout. I want the format of both views to be like the one on the left ("Today's Special"). I've assigned both views the same attributes though they are different.
here is my xml.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:ignore="ExtraText">
<RelativeLayout
android:id="#+id/view_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/bg_row_background">
<ImageView
android:id="#+id/delete_icon"
android:layout_width="#dimen/ic_delete"
android:layout_height="#dimen/ic_delete"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginEnd="#dimen/padd_10"
android:contentDescription="#string/deleteIcon"
android:src="#drawable/ic_delete_white_24dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginEnd="#dimen/padd_10"
android:layout_toStartOf="#id/delete_icon"
android:text="#string/delete"
android:textColor="#fff"
android:textSize="12sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/view_foreground"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:padding="#dimen/padd_5">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="#dimen/ic_delete"
android:background="#color/description"
android:textColor="#color/item_name"
android:textSize="12sp" />
<TextView
android:id="#+id/namecat"
android:layout_width="wrap_content"
android:layout_height="#dimen/ic_delete"
android:layout_alignParentEnd="true"
android:layout_toEndOf="#id/name"
android:background="#color/description"
android:paddingStart="#dimen/padd_10"
android:textColor="#color/item_name"
android:textSize="12sp" />
</RelativeLayout>
</FrameLayout>
Thanks for your help.

Replace FrameLayout with LinearLayout and weightsum property
<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="wrap_content"
android:orientation="horizontal"
android:weightSum="2"
tools:ignore="ExtraText">
<RelativeLayout
android:id="#+id/view_background"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#978c8c">
<ImageView
android:id="#+id/delete_icon"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_lock" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toStartOf="#id/delete_icon"
android:text="#string/dummy_button"
android:textColor="#fff"
android:textSize="12sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/view_foreground"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="#android:color/white">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:background="#color/colorAccent"
android:textColor="#color/colorPrimary"
android:textSize="12sp" />
<TextView
android:id="#+id/namecat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_toEndOf="#id/name"
android:background="#color/colorAccent"
android:textColor="#color/colorPrimaryDark"
android:textSize="12sp" />
</RelativeLayout>
</LinearLayout>

How to put a textview behind a button?

I have this problem, that I want to elevate my "Menu" buttons but the elevation bugs and it looks like this. I figured butting an empty TextView behind them and elevating it. Yet when I do this it gets in front of the buttons and visually covers them, yet the buttons are still functioning (it looks like this). I made it to be created before the buttons, yet it still doesn't work. How to fix it?
Edit: activity.xml
<?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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".PortfolioActivity">
<TextView
android:id="#+id/Background_for_buttons"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#android:color/white"
android:elevation="10dp"
android:gravity="center"
android:textColor="#FF000000" />
<Button
android:id="#+id/portfolio_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="128dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="#android:color/white"
android:text="Portfolio" />
<Button
android:id="#+id/settings_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="128dp"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true"
android:background="#android:color/white"
android:text="Settings" />
<Button
android:id="#+id/home_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="128dp"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#android:color/white"
android:text="Overview" />
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginTop="226dp"
android:padding="20dp"
android:background="#android:color/white"
android:elevation="20dp"
android:text="ASDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD" />
<Button
android:id="#+id/add_coin_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:text="ADD" />
</RelativeLayout>

Your approach is wrong. Use the code below, I just used a horizontal LinearLayout inside a vertical LinearLayout for your menu, and removed your textView. WeightSum is used so that all your 3 buttons will have the same width and fill the screen width.
<?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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".PortfolioActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<Button
android:id="#+id/home_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Overview" />
<Button
android:id="#+id/portfolio_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Portfolio" />
<Button
android:id="#+id/settings_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true"
android:layout_weight="1"
android:background="#android:color/white"
android:text="Settings" />
</LinearLayout>
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginTop="226dp"
android:background="#android:color/white"
android:elevation="20dp"
android:padding="20dp"
android:text="ASDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD" />
<Button
android:id="#+id/add_coin_button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:text="ADD" />
</LinearLayout>
</RelativeLayout>

Adding helper text under a button

I'm currently trying to achieve this.
I'm trying to add a helper text to the button. But I'm having a hard time this is my current code.
<LinearLayout
android:orientation="vertical"
android:layout_height="match_parent"
android:layout_width="match_parent">
<Button
android:id="#+id/login_btnLogin"
android:layout_width="412dp"
android:layout_height="90dp"
android:layout_gravity="center"
android:background="#color/myGreen"
android:text="Continue"
android:textAllCaps="false"
android:textSize="30sp"
android:textColor="#color/ghostWhiteColor" />
</LinearLayout>

Try this
<?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="90dp">
<ImageButton
android:layout_width="match_parent"
android:layout_height="90dp"
android:background="#color/colorAccent" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="30dp"
android:text="Verify"
android:textColor="#fff"
android:textSize="25sp" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:gravity="center"
android:padding="5dp"
android:text="By preceding verify I agree terms and conditions."
android:textColor="#fff" />
</FrameLayout>

Use linaer layout instead of button.
<LinearLayout
android:orientation="vertical"
android:layout_height="match_parent"
android:layout_width="match_parent">
<LinearLayout
android:id="#+id/login_btnLogin"
android:layout_width="412dp"
android:layout_height="90dp"
android:layout_gravity="center"
android:background="#color/myGreen">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Continue"
android:textAllCaps="false"
android:textSize="30sp"
android:textColor="#color/ghostWhiteColor" />
<TextVie
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="click to continue..."
android:textAllCaps="false"
android:textSize="30sp"
android:textColor="#color/ghostWhiteColor" />
</LinearLayout>

How to remove Irregularity in layout of items in listview in android?

This is how the cart screen looks like. The layout changes as per the length of item name.
I want to keep a fixed ratio for all columns in the listview and at the same time, keep the size of button fixed.
How to achieve this ?
Below is the Screenshoot and layout code:
]1
Layout file:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="*"
android:background="#ffffff">
<TableRow>
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/cartlist_layout"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/t1"
android:textStyle="normal|bold"
android:padding="5dip"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#+id/t2"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/t2"
android:padding="5dip"
android:textStyle="normal|bold"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#+id/t2"
android:id="#+id/t3"
android:textStyle="normal|bold" />
<Button
android:layout_width="5dp"
android:layout_height="50dp"
android:id="#+id/button6"
android:background="#drawable/delete1" />
</TableRow>>
</TableLayout>
Edit1: The Listview layout code:
<?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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/fragment_mycart">
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/listView1" />
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_margin="16dp"
android:clickable="true"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:background="#color/colorPrimary"
app:backgroundTint="#android:color/holo_orange_light"
app:borderWidth="0dp"
app:elevation="6dp"
app:fabSize="normal"
app:srcCompat="#drawable/cart" />
</RelativeLayout>

You can use a LinearLayout as root view of the item instead of TableLayout. You can add weights to the views inside the LinearLayout.
<?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="horizontal"
android:background="#ffffff">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:id="#+id/t1"
android:textStyle="normal|bold"
android:padding="5dip"
android:maxLines="1"
android:ellipsize="end" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/t2"
android:padding="5dip"
android:textStyle="normal|bold" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_weight="1"
android:id="#+id/t3"
android:textStyle="normal|bold" />
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button6"
android:background="#drawable/delete1" />
</LinearLayout>
</LinearLayout>
Note : You may want to adjust the weights a bit.

Use LinearLayout instead
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:id="#+id/t1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dip"
android:text="text1"
android:textStyle="normal|bold" />
<TextView
android:id="#+id/t2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dip"
android:text="text2"
android:textStyle="normal|bold" />
<TextView
android:id="#+id/t3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dip"
android:text="text3"
android:textStyle="normal|bold" />
<Button
android:id="#+id/button6"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#android:drawable/ic_input_add" />
</LinearLayout>

Categories

Resources