Adding helper text under a button

Adding helper text under a button - android

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>

Related

How can the cards fill the entire width of the screen?

I'm trying to create a recyclerview of cards. I get the information from the firebase realtime database but cards didn't fill the width of screen.
find_tournament.xml:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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="#3E2743"
android:orientation="vertical"
tools:context=".FindTournamentActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
android:orientation="vertical">
<ImageView
android:id="#+id/tournamentImageParticipant"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_gravity="center"/>
<TextView
android:id="#+id/tournamentLabelParticipant"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fontFamily="#font/baloo"
android:text="Tournament Name"
android:textAlignment="center"
android:textColor="#color/jitrino"
android:textSize="20sp" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_marginBottom="20dp"/>
</LinearLayout>
</ScrollView>
Desing view of find tournament:
find_tournament.xml
tournament_row.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView 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="wrap_content"
android:elevation="20dp"
app:cardBackgroundColor="#4F2A36"
app:cardUseCompatPadding="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="20dp">
<ImageView
android:id="#+id/tournamentImageRow"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#mipmap/ic_launcher" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:orientation="vertical">
<TextView
android:id="#+id/tournamentNameRow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tournament Name"
android:textColor="#color/white"
android:textSize="20sp" />
<TextView
android:id="#+id/tournamentGameRow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tournament Game"
android:textColor="#color/white"
android:textSize="20sp" />
<TextView
android:id="#+id/tournamentRewardRow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Reward"
android:textColor="#color/white"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="20dp"
android:orientation="horizontal">
<TextView
android:id="#+id/tournamentPersonRow"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center_vertical"
android:text="N"
android:textColor="#color/white"
android:textSize="20sp" />
<TextView
android:layout_marginLeft="5dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center_vertical"
android:text="Vs"
android:textColor="#color/white"
android:textSize="20sp" />
<TextView
android:id="#+id/tournamentPerson2Row"
android:layout_marginLeft="5dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center_vertical"
android:text="N"
android:textColor="#color/white"
android:textSize="20sp" />
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>
Desing view of tournament row:
tournament_row.xml
Here is the result when i run the app. How can i fill gaps?
result

<androidx.cardview.widget.CardView 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="wrap_content"
android:elevation="20dp"
app:cardBackgroundColor="#4F2A36"
app:cardUseCompatPadding="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="20dp">
<ImageView
android:id="#+id/tournamentImageRow"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#mipmap/ic_launcher" />
<LinearLayout
android:layout_toRightOf="#id/tournamentImageRow"
android:layout_toLeftOf="#+id/end"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:orientation="vertical">
<TextView
android:id="#+id/tournamentNameRow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tournament Name"
android:textColor="#color/white"
android:textSize="20sp" />
<TextView
android:id="#+id/tournamentGameRow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tournament Game"
android:textColor="#color/white"
android:textSize="20sp" />
<TextView
android:id="#+id/tournamentRewardRow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Reward"
android:textColor="#color/white"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/end"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#id/tournamentImageRow"
android:layout_alignBottom="#id/tournamentImageRow"
android:layout_alignParentRight="true"
android:layout_marginLeft="20dp"
android:orientation="horizontal">
<TextView
android:id="#+id/tournamentPersonRow"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center_vertical"
android:text="N"
android:textColor="#color/white"
android:textSize="20sp" />
<TextView
android:layout_marginLeft="5dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center_vertical"
android:text="Vs"
android:textColor="#color/white"
android:textSize="20sp" />
<TextView
android:id="#+id/tournamentPerson2Row"
android:layout_marginLeft="5dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center_vertical"
android:text="N"
android:textColor="#color/white"
android:textSize="20sp" />
</LinearLayout>
</RelativeLayout>
</androidx.cardview.widget.CardView>

The width of the LinearLayout below the image is wrap_content. You can go around this problem by using weight.
Refer to this link for more information about weight
https://android--examples.blogspot.com/2016/06/android-understanding-linearlayout.html
Please note that it is recommended to use ConstraintLayout.

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.

ScrollView XML View At Bottom

I am trying to bring the Proceed button at the bottom but it is not aligned with the bottom. This problem occurs when I use ScrollView, Below is the XML and image. I tried every possible way to bring the proceed button at the bottom with ScrollView inside the XML.
If I do not include scrollView the layout is according to what i need
screenshot
<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/backgroundColor"
xmlns:android="http://schemas.android.com/apk/res/android">
<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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/backgroundColor">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="USER AGREEMENT"
android:textColor="#android:color/white"
android:gravity="center"
android:id="#+id/userAgereement"
android:layout_marginTop="20dp"
android:textSize="#dimen/textSize"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Beijing Pinnacle Global & Alex Edu\n(BPGE & Alex Edu)"
android:textColor="#android:color/white"
android:gravity="center"
android:layout_marginEnd="5dp"
android:layout_marginStart="5dp"
android:id="#+id/belowHeadingText"
android:layout_marginTop="20dp"
android:textSize="#dimen/endSize"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Today's Date : 25th of August, 2019"
android:textColor="#android:color/white"
android:gravity="center"
android:layout_marginTop="20dp"
android:id="#+id/date"
android:textSize="#dimen/endSize"/>
<View
android:layout_width="270dp"
android:layout_gravity="center"
android:layout_marginTop="4dp"
android:background="#android:color/white"
android:layout_height="1dp">
</View>
<ImageView
android:layout_marginTop="20dp"
android:layout_width="171dp"
android:layout_height="239dp"
android:layout_gravity="center"
android:clickable="true"
android:foreground="?attr/selectableItemBackgroundBorderless"
android:src="#drawable/useragreemnet"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="You Are Going To Sign The User Agreement\nKindly, Provide Us Your Details"
android:textColor="#android:color/white"
android:gravity="center"
android:id="#+id/belowImageText"
android:layout_marginTop="20dp"
android:textSize="#dimen/endSize"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
android:layout_gravity="center"
android:layout_height="match_parent">
<android.support.v7.widget.CardView
android:layout_width="230dp"
app:cardElevation="#dimen/elevation"
app:cardCornerRadius="#dimen/cornerRadiusForButtons"
app:cardBackgroundColor="#color/functionalityColor"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"
android:layout_height="#dimen/buttonHeight">
<Button
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="#dimen/buttonHeight"
android:clickable="true"
android:foreground="?attr/selectableItemBackgroundBorderless"
android:id="#+id/proceed"
android:text="PROCEED"
android:onClick="onClick"
android:textSize="#dimen/buttonTextSize"
android:textColor="#android:color/white"
android:background="#android:color/transparent"
android:layout_marginBottom="20dp"/>
</android.support.v7.widget.CardView>
</RelativeLayout>
</LinearLayout>
</ScrollView>

Use this xml code inside your layout file , it will keep Proceed Button at down
<?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"
android:orientation="vertical">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/backgroundColor">
<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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/backgroundColor"
android:orientation="vertical">
<TextView
android:id="#+id/userAgereement"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:text="USER AGREEMENT"
android:textColor="#android:color/white"
android:textSize="#dimen/textSize" />
<TextView
android:id="#+id/belowHeadingText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="5dp"
android:gravity="center"
android:text="Beijing Pinnacle Global & Alex Edu\n(BPGE & Alex Edu)"
android:textColor="#android:color/white"
android:textSize="#dimen/endSize" />
<TextView
android:id="#+id/date"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:text="Today's Date : 25th of August, 2019"
android:textColor="#android:color/white"
android:textSize="#dimen/endSize" />
<View
android:layout_width="270dp"
android:layout_height="1dp"
android:layout_gravity="center"
android:layout_marginTop="4dp"
android:background="#android:color/white">
</View>
<ImageView
android:layout_width="171dp"
android:layout_height="239dp"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:clickable="true"
android:foreground="?attr/selectableItemBackgroundBorderless"
android:src="#drawable/useragreemnet"
/>
<TextView
android:id="#+id/belowImageText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:text="You Are Going To Sign The User Agreement\nKindly, Provide Us Your Details"
android:textColor="#android:color/white"
android:textSize="#dimen/endSize" />
</LinearLayout>
</ScrollView>
<android.support.design.widget.BottomNavigationView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp">
<android.support.v7.widget.CardView
app:cardBackgroundColor="#color/functionalityColor"
app:cardCornerRadius="#dimen/cornerRadiusForButtons"
app:cardElevation="#dimen/elevation"
android:layout_width="230dp"
android:layout_height="#dimen/buttonHeight"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp">
<Button
android:id="#+id/proceed"
android:layout_width="match_parent"
android:layout_height="#dimen/buttonHeight"
android:layout_marginBottom="20dp"
android:background="#android:color/transparent"
android:clickable="true"
android:foreground="?attr/selectableItemBackgroundBorderless"
android:gravity="center"
android:onClick="onClick"
android:text="PROCEED"
android:textColor="#android:color/white"
android:textSize="#dimen/buttonTextSize" />
</android.support.v7.widget.CardView>
</RelativeLayout>
</android.support.design.widget.BottomNavigationView>
</RelativeLayout>

Android studio horizontal layout troubles

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

Creating UI without XML in android

I am new to android programming,and I want to create UI in android without using xml files. I am having following UI with xml can I create the same UI programatically, is there any other way of doing it? some references will be very helpful.
<?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"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="2dp"
android:layout_marginRight="5dp"
android:layout_marginLeft="5dp"
android:weightSum="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="110dp"
android:tag="images"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView2"
android:layout_width="163dp"
android:layout_height="86dp"
app:srcCompat="logo1" />
<ImageView
android:id="#+id/imageView3"
android:layout_marginTop="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:srcCompat="logo2" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:tag="info1"
android:weightSum="1">
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="30dp"
android:textAlignment="center"
android:layout_marginBottom="5dp"
android:text="some text"
android:textSize="10pt" />
<TextView
android:id="#+id/multilineText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="textStart"
android:layout_gravity="start"
android:text="additonal Text"
android:textSize="10pt"/>
<TextView
android:id="#+id/Text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="textStart"
android:layout_gravity="start"
android:layout_marginTop="3dp"
android:text="additional info 1"
android:textSize="10pt"/>
<TextView
android:id="#+id/enterText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAlignment="textStart"
android:layout_marginTop="10dp"
android:layout_gravity="start"
android:text="#string/prompt"
android:textSize="10pt"/>
<EditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="password"
android:hint="hint" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginLeft="6dp"
android:layout_marginTop="12dp"
android:layout_weight="0.10"
android:background="#color/darkBlue"
android:text="Verify" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginLeft="6dp"
android:layout_marginTop="12dp"
android:background="#color/grey"
android:text="retry" />
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:orientation="vertical"
android:layout_marginLeft="6dp"
android:layout_weight="0.58">
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal">
<com.ms.square.android.expandabletextview.ExpandableTextView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:expandableTextView="http://schemas.android.com/apk/res-auto"
android:id="#+id/expand_text_view"
android:layout_width="350dp"
android:layout_height="wrap_content"
android:textAlignment="center"
expandableTextView:animDuration="500"
expandableTextView:maxCollapsedLines="1">
<TextView
android:id="#id/expandable_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:textColor="#0d0d0d"
android:textSize="16dp" />
<ImageButton
android:id="#id/expand_collapse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|bottom"
android:background="#android:color/transparent"
android:padding="16dp" />
</com.ms.square.android.expandabletextview.ExpandableTextView>
</ScrollView>
<View
android:layout_width="fill_parent"
android:layout_height="2dip"
android:background="#color/grey" />
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal">
<com.ms.square.android.expandabletextview.ExpandableTextView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:expandableTextView="http://schemas.android.com/apk/res-auto"
android:id="#+id/expand_text_view2"
android:layout_width="350dp"
android:layout_height="wrap_content"
android:textAlignment="center"
expandableTextView:animDuration="500"
expandableTextView:maxCollapsedLines="1">
<TextView
android:id="#id/expandable_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:textColor="#0d0d0d"
android:textSize="16dp" />
<ImageButton
android:id="#id/expand_collapse"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|bottom"
android:background="#android:color/transparent"
android:padding="16dp" />
</com.ms.square.android.expandabletextview.ExpandableTextView>
</ScrollView>
</LinearLayout>
</LinearLayout>

Yes, you can create UI run time without xml using java code.
Please add a Linear/Relative layout in xml file and then add views you want to require in it.
Here is the very simple example to create UI programmatically.
http://www.c-sharpcorner.com/article/create-user-interface-programmatically-in-android-application/

At the bottom of the screen there are two tabs: Design and Text
Click on the Design tab and you can modify it from there without touching the xml.
See the attached image.

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

Adding helper text under a button - android

Related

How can the cards fill the entire width of the screen?

Recyclerview items text look different on different devices

ScrollView XML View At Bottom

Android studio horizontal layout troubles

Creating UI without XML in android

Categories

Resources