How to fill the entire screen in a RecyclerView - java

I have a problem filling the entire screen in a reclycle view.
This is my xml code of the cardview and my view where the reclyclerview is:
CardView:
This is how it looks in the Ide Android studio:
Layout where the Reclycler view is:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/textAmount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:padding="4dp"
android:text="30"
android:textSize="30sp" />
<TextView
android:id="#+id/textIdPerson"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:padding="4dp"
android:text="30"
android:textSize="30sp" />
<TextView
android:id="#+id/textId"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:padding="4dp"
android:text="30"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="4dp">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="4dp"
app:cardCornerRadius="4dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/textAmount"
android:padding="8dp"
android:text="ID"
android:textSize="30sp"
android:layout_weight="1"
android:gravity="center"/>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/textIdPerson"
android:padding="8dp"
android:layout_weight="1"
android:text="UserId"
android:textSize="30sp"
android:gravity="center"/>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/textId"
android:padding="8dp"
android:textSize="30sp"
android:layout_weight="1"
android:text="Amount"
android:gravity="center"/>
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.recyclerview.widget.RecyclerView
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/recycler_view"
android:nestedScrollingEnabled="false"
tools:listitem="#layout/list_row_main"/>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignParentBottom="true">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="atras"
android:onClick="#{viewmodel::back}"
android:layout_weight="1"
android:layout_marginRight="4dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Siguiente"
android:onClick="#{viewmodel::next}"
android:layout_weight="1"/>
</LinearLayout>
Image:
enter image description here
But when I start the application on the device it looks like this
enter image description here


Your activity_main.xml(or any layout that hosts recyclerview) should look like this.
<androidx.appcompat.widget.LinearLayoutCompat 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"
>
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_marginStart="5dp"
android:layout_marginTop="10dp"
android:layout_marginEnd="5dp"
app:cardCornerRadius="5dp"
app:cardElevation="8dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="center"
android:gravity="center_vertical|center"
android:orientation="horizontal">
<TextView
android:id="#+id/textAmount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:padding="4dp"
android:text="Amount"
android:textSize="30sp" />
<TextView
android:id="#+id/textIdPerson"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:padding="4dp"
android:text="UserID"
android:textSize="30sp" />
<TextView
android:id="#+id/textId"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:padding="4dp"
android:text="Id"
android:textSize="30sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_marginBottom="8dp"
android:layout_weight="2"
android:nestedScrollingEnabled="false"
tools:listitem="#layout/list_item" />
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/btnAtras"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:layout_marginBottom="5dp"
android:layout_weight="1"
android:text="ATRAS"
/>
<Button
android:id="#+id/btnSignature"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:layout_marginBottom="5dp"
android:layout_weight="1"
android:text="Signature" />
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.appcompat.widget.LinearLayoutCompat>
And list_item.xml layout should be something like below:
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
xmlns:app="http://schemas.android.com/apk/res-auto">
<androidx.cardview.widget.CardView
android:layout_width="0dp"
android:layout_height="60dp"
app:cardCornerRadius="5dp"
app:cardElevation="8dp"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
app:cardUseCompatPadding="false"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_gravity="center"
android:gravity="center|center_vertical"
>
<TextView
android:gravity="center"
android:id="#+id/textAmount"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_width="match_parent"
android:padding="8dp"
android:text="Amount"
android:textSize="30sp" />
<TextView
android:gravity="center"
android:id="#+id/textIdPerson"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_width="match_parent"
android:padding="8dp"
android:text="UserId"
android:textSize="30sp" />
<TextView
android:gravity="center"
android:id="#+id/textId"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_width="match_parent"
android:padding="8dp"
android:text="Id"
android:textSize="30sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>


Check your adapter class, Layout you designed for adapter class should have width match parent and three different textviews with equal width to hold values.


Make sure the RecyclerView has layout_width also set to match_parent.

Related

Pin ImageView and headed view in the top while scrolling and make the other view as scrollable in android

I need to pin the image while scrolling with the headed section and need to scroll other thing in the screen.
Here I need the header as fixed while scrolling and the half of the fill 2 image shown while scrolling.
Now the header actionsof on click are not working after addding nestedScrollView.
Also the nested view is overlapping with the above view while scrolling
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/coordinator"
style="#style/CoordinatorLayout"
android:background="red"
tools:ignore="RtlHardcoded">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/layout_app_bar"
style="#style/Collapsing.AppBarLayout"
android:background="blue">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/layout_collapsing_toolbar"
style="#style/Collapsing.CollapsingToolbarLayout"
android:layout_height="427dp">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="#dimen/spacing_x5"
android:background="green"
android:gravity="center"
android:id="#+id/header_view"
android:visibility="visible"
android:orientation="horizontal">
<ImageView
android:id="#+id/back"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#drawable/black"
android:clickable="true"
android:contentDescription="#string/back"
android:src="#drawable/ic_arrow_left"/>
<TextView
android:id="#+id/header_my_home"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:clickable="true"
android:textSize="18dp"
android:gravity="center"
android:textColor="#color/white"
android:scaleType="centerInside"
android:text="MY Home Feed"/>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/label"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:clickable="true"
android:orientation="vertical"
>
<TextView
android:id="#+id/label1"
android:layout_width="80dp"
android:layout_height="48dp"
android:gravity="center"
android:visibility="visible"
android:clickable="true"
android:textSize="18dp"
android:textColor="#707070"
android:text="label1"
/>
</RelativeLayout>
</LinearLayout>
<ImageView
android:id="#id/iv_background"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:layout_marginTop="50dp"
android:adjustViewBounds="true"
android:src="#drawable/image" />
<ImageView
android:id="#id/fill_1"
android:src="#drawable/fill_1"
android:scaleType="fitStart"
android:layout_marginTop="148dp"
android:layout_marginLeft="-20dp"
android:layout_marginRight="-20dp"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<ImageView
android:id="#id/fill_2"
android:src="#drawable/fill_2"
android:scaleType="fitCenter"
android:layout_marginTop="128dp"
android:layout_marginLeft="-20dp"
android:layout_marginRight="-20dp"
android:layout_marginBottom="-30dp"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</FrameLayout>
</com.google.android.material.appbar.CollapsingToolbarLayout>
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Collapsing.Toolbar" />
<View
android:id="#+id/divider"
style="#style/Collapsing.Divider" />
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView android:layout_height="wrap_content"
android:layout_width="wrap_content" android:id="#+id/nested_scroll">
<LinearLayout
android:layout_width="match_parent"
android:layout_gravity="center"
android:orientation="vertical"
android:layout_marginTop="500dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="27dp"
android:layout_marginTop="5dp"
android:layout_gravity="center"
>
</TextView>
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_gravity="center"
android:layout_marginTop="30dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:id="#+id/recycler_view"
android:orientation="horizontal"
android:layout_height="wrap_content">
</androidx.recyclerview.widget.RecyclerView>
<View style="#style/Divider.Horizontal.Gray"
android:layout_width="match_parent"
android:layout_marginTop="#dimen/spacing_x2"
android:layout_marginBottom="#dimen/spacing_x2"
android:layout_height="2dp"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_gravity="center"
android:orientation="horizontal"
android:layout_marginLeft="20dp"
android:visibility="gone"
android:layout_marginRight="20dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="21sp"
android:layout_weight="1"
android:layout_gravity="left"
>
</TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="14sp"
android:layout_weight="0.1"
android:layout_gravity="right"
android:text="lanl">
</TextView>
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/recycler_view"
android:visibility="gone"
android:orientation="vertical"
>
</androidx.recyclerview.widget.RecyclerView>
<LinearLayout
android:layout_width="match_parent"
android:layout_gravity="center"
android:orientation="horizontal"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="21sp"
android:layout_weight="1"
>
</TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="14sp"
android:layout_weight="0.1"
android:layout_gravity="right"
>
</TextView>
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_margin="20dp"
android:id="#+id/recycler_view1"
android:orientation="horizontal"
android:layout_height="wrap_content">
</androidx.recyclerview.widget.RecyclerView>
<View style="#style/Divider.Horizontal.Gray"
android:layout_width="match_parent"
android:layout_marginTop="#dimen/spacing_x2"
android:layout_marginBottom="#dimen/spacing_x2"
android:layout_height="2dp"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"android:visibility="visible">
<LinearLayout
android:layout_width="match_parent"
android:layout_gravity="center"
android:orientation="horizontal"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_height="wrap_content"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:layout_weight="1"
android:layout_gravity="left"
>
</TextView>
<ImageView
android:layout_width="30dp"
android:layout_height="27dp"
android:layout_weight="0.1"
android:layout_gravity="right"
>
</ImageView>
</LinearLayout>
<com.google.android.material.tabs.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignTop="#id/search"
android:layout_marginTop="15dp"
android:background="#color/dark_blue"
app:tabGravity="fill"
app:tabIndicatorColor="#color/blue_light"
app:tabIndicatorHeight="5dp"
app:tabMode="scrollable" />
<com.finaonation.utility.NonScrollableViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_gravity="center"
android:layout_margin="20dp"
android:orientation="horizontal"
android:layout_height="wrap_content">
</androidx.recyclerview.widget.RecyclerView>
<LinearLayout
android:layout_width="match_parent"
android:layout_gravity="center"
android:orientation="horizontal"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginBottom="20dp"
android:layout_height="wrap_content"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:layout_weight="1"
android:layout_gravity="left"
android:textSize="16sp"
</TextView>
<ImageView
android:layout_width="30dp"
android:layout_height="27dp"
android:layout_weight="0.1"
android:layout_gravity="right"
>
</ImageView>
</LinearLayout>
<View style="#style/Divider.Horizontal.Gray"
android:layout_width="match_parent"
android:layout_marginTop="#dimen/spacing_x2"
android:layout_marginBottom="#dimen/spacing_x2"
android:layout_height="2dp"
android:id="#+id/divider"
android:visibility="visible"/>
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_gravity="center"
android:layout_margin="20dp"
android:id="#+id/recycler_view_m"
android:orientation="horizontal"
android:layout_height="wrap_content">
</androidx.recyclerview.widget.RecyclerView>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

<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="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<!-- HEADER -->
<RelativeLayout
...
app:layout_collapseMode="parallax">
.....
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
<!-- IF YOU WANT TO KEEP "Choose Item" always on top of the RecyclerView, put this TextView here
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="choose item" />
-->
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>

Toolbar back arrow with icon

How to display icon with back arrow in android toolbar like WhatsApp ?
I would like to reduce the space between the photo and the back arrow.
How can I reduce space?
I have:
ChatActivity.java: the layout (which has only one view) is replaced with ChatFragment.java. Moreover, the toolbar is replaced here with fragment_chat_toolbar.xml
ChatFragment.java: here the inputs, the emojis, the files etc. are managed
Thanks.
My toolbar chat
fragment_chat.xml
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/layout_chat"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<android.support.v7.widget.RecyclerView
android:id="#+id/fragment_chat_recycler_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_weight="1"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginBottom="4dp"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:gravity="center" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_marginEnd="4dp"
android:background="#drawable/incoming_message"
android:baselineAligned="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingBottom="2dp"
android:paddingStart="2dp"
android:paddingEnd="4dp" >
<ImageView
android:id="#+id/image_view_emoji"
android:layout_width="28dp"
android:layout_height="28dp"
android:layout_marginStart="6dp"
android:layout_gravity="center"
android:contentDescription="#string/emoji_button"
android:src="#mipmap/ic_emoji"
android:tint="#color/total_black" />
<com.vanniktech.emoji.EmojiEditText
android:id="#+id/message_box_emoji"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="8dp"
android:layout_weight="1"
android:background="#color/incomingColor"
android:hint="#string/send_message"
app:emojiSize="26sp"/>
<ImageView
android:id="#+id/image_view_camera"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="6dp"
android:layout_gravity="center"
android:contentDescription="#string/camera_button"
android:src="#mipmap/ic_camera"
android:tint="#color/total_black" />
</LinearLayout>
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/float_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:src="#mipmap/ic_voice_recorder"
android:tint="#color/white"
app:backgroundTint="#color/colorPrimary"
app:elevation="0dp"
app:fabSize="mini"/>
</LinearLayout>
</LinearLayout>
fragment_chat_toolbar.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fresco="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:clipChildren="false" >
<com.facebook.drawee.view.SimpleDraweeView
android:id="#+id/profile_photo"
android:layout_width="50dp"
android:layout_height="50dp"
fresco:failureImage="#drawable/default_profile"
fresco:placeholderImage="#drawable/default_profile"
fresco:roundAsCircle="true" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="4dp"
android:gravity="start"
android:orientation="vertical" >
<TextView
android:id="#+id/chat_title_text_view"
android:layout_width="wrap_content"
android:textSize="16sp"
android:layout_height="wrap_content"
android:maxLines="1"
android:textColor="#color/white" />
<TextView
android:id="#+id/chat_subtitle_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="1"
android:textColor="#color/white" />
</LinearLayout>

Make Custom Toolbar as you like. Change your layout in RelativeLayout
<android.support.v7.widget.Toolbar
android:id="#+id/toolBar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
app:contentInsetStart="0dp"
app:popupTheme="#style/AppTheme.PopupOverlay">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/llLeft"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#drawable/transparent_layout_background"
android:clickable="true"
android:focusable="true"
android:gravity="center"
android:padding="10dp">
<ImageView
android:id="#+id/ivLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_action_menu" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toEndOf="#+id/llLeft"
android:layout_toLeftOf="#+id/llRight"
android:layout_toRightOf="#+id/llLeft"
android:layout_toStartOf="#+id/llRight"
android:gravity="center">
<TextView
android:id="#+id/tvTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:fontFamily="#font/roboto_bold"
android:lines="1"
android:text="asdf"
android:textColor="#color/colorWhite"
android:textSize="18sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/llRight"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:background="#drawable/transparent_layout_background"
android:clickable="true"
android:focusable="true"
android:gravity="center"
android:padding="10dp">
<ImageView
android:id="#+id/ivRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_action_search" />
</LinearLayout>
</RelativeLayout>
</android.support.v7.widget.Toolbar>

How to create a TextView with title and background shape

I am looking to create TextViews like the following, but have had no luck so far:
TextViews with titles and background shape
Is this possible with a TextView or is something like a CardView needed?
So far I have created two TextViews, one being the title and the other the value that needs to be displayed. However, there must be a better solution, and I don't know how to create the box surrounding the TextViews.
Thank you very much in advance!

There you go
activity_main.xml
<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="#eee"
android:gravity="center_horizontal"
android:orientation="vertical"
android:padding="12dp">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="6dp"
tools:style="#style/CardView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="8dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:padding="12dp"
android:text="Current Training Maxes"
android:textSize="18sp"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<android.support.v7.widget.CardView
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_weight="1"
app:cardCornerRadius="6dp"
app:cardElevation="5dp"
tools:style="#style/CardView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#5E9EA0"
android:gravity="center_horizontal"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:text="Bench"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:text="62.5"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_weight="1"
app:cardCornerRadius="6dp"
app:cardElevation="5dp"
tools:style="#style/CardView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#5E9EA0"
android:gravity="center_horizontal"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:text="Squat"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:text="70.0"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_weight="1"
app:cardCornerRadius="6dp"
app:cardElevation="5dp"
tools:style="#style/CardView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#5E9EA0"
android:gravity="center_horizontal"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:text="Deadlift"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:text="102.5"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_weight="1"
app:cardCornerRadius="6dp"
app:cardElevation="5dp"
tools:style="#style/CardView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#5E9EA0"
android:gravity="center_horizontal"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:text="OHP"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:text="45.5"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
Result
Tip
don't forget to add implementation 'com.android.support:cardview-v7:27.1.1' to your build.gradle
read https://developer.android.com/guide/topics/ui/declaring-layout

center content in a simple legend layout

I build a layout that overflows the google maps and it look like that: image
so the problem that i get with the layout on the bottom is that i can't center all the conter it stays too much on the left side and i don't know really why.
I want to center the content but mantain the space with each elemnt(i consider the element the background color + the text).
How can i do it?
here is my xml(that contains the map and the layout):
<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="match_parent">
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.afcosta.inesctec.pt.android.MapsActivity" />
<LinearLayout
android:id="#+id/newmarker"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#FFFFFFFF"
android:gravity="center_horizontal"
android:orientation="vertical">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:paddingBottom="10dp"
android:layout_weight="1"
android:text="Legenda"
android:textAppearance="?android:attr/textAppearanceMedium" />
<LinearLayout
android:id="#+id/rand"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#FFFFFFFF"
android:gravity="center"
android:weightSum="3"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/myPos"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:background="#FFFFFFFF"
android:orientation="horizontal">
<Button
android:id="#+id/newmarker_save1"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#color/red" />
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="5dp"
android:text="Utilizador" />
</LinearLayout>
<LinearLayout
android:id="#+id/allFotos"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:background="#FFFFFFFF"
android:orientation="horizontal">
<Button
android:id="#+id/newmarker_save2"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#color/emerald" />
<TextView
android:id="#+id/Fotos"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="5dp"
android:text="Fotos" />
</LinearLayout>
<LinearLayout
android:id="#+id/Photo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginTop="10dp"
android:background="#FFFFFFFF"
android:gravity="center_horizontal"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:id="#+id/button2"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#color/yellow" />
<TextView
android:id="#+id/textView9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:layout_weight="1"
android:text="Planta" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</FrameLayout>
thanks!

You have to wrap_content your Button and you TextView, remove android:layout_weight="1" from the textView that lives beside your Button, then finally make sure that every single LinearLayout that wraps your Button and TextView are flagged as android:gravity="center" (this gravity is gonna be applied for its childs)
Also I strongly advise you replacing these linear layouts for Relatives to reduce your UI hierarchy
Try this.
<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="match_parent">
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.afcosta.inesctec.pt.android.MapsActivity" />
<LinearLayout
android:id="#+id/newmarker"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#FFFFFFFF"
android:gravity="center_horizontal"
android:orientation="vertical">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:paddingBottom="10dp"
android:layout_weight="1"
android:text="Legenda"
android:textAppearance="?android:attr/textAppearanceMedium" />
<LinearLayout
android:id="#+id/rand"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#FFFFFFFF"
android:gravity="center"
android:weightSum="3"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/myPos"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="10dp"
android:gravity="center_horizontal"
android:layout_weight="1"
android:background="#FFFFFFFF"
android:orientation="horizontal">
<Button
android:id="#+id/newmarker_save1"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#color/colorAccent" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:text="Utilizador" />
</LinearLayout>
<LinearLayout
android:id="#+id/allFotos"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:gravity="center_horizontal"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:background="#FFFFFFFF"
android:orientation="horizontal">
<Button
android:id="#+id/newmarker_save2"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#color/colorAccent" />
<TextView
android:id="#+id/Fotos"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:text="Fotos" />
</LinearLayout>
<LinearLayout
android:id="#+id/Photo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginTop="10dp"
android:background="#FFFFFFFF"
android:gravity="center_horizontal"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:id="#+id/button2"
android:layout_width="20dp"
android:layout_height="20dp"
android:background="#color/colorAccent" />
<TextView
android:id="#+id/textView9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:text="Planta" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I presume that's what you want, right?

how to center invisible Button

i'm trying to make (try again) button in center this button is invisible , i already tried to put : android:layout_gravity="center"
but doesn't work any suggestions for resolve this problems
This what he give me :
My XML file :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#ffff"
android:id="#+id/activity_viewsol">
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_top"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="#color/colorPrimary"
app:theme="#style/ThemeOverlay.AppCompat.Light"
android:fitsSystemWindows="true"
app:layout_collapseMode="pin"
android:elevation="5dp"
app:navigationIcon="#drawable/ic_back"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#ffffff"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textSize="48sp"
android:textStyle="bold"
android:text="Solution"
android:id="#+id/toolbar_title" />
</android.support.v7.widget.Toolbar>
</RelativeLayout>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:id="#+id/scrollview"
android:stackFromBottom="true"
android:scrollbarSize="10dp"
android:scrollbarThumbVertical="#drawable/scrollbar"
android:transcriptMode="alwaysScroll">
<LinearLayout
android:id="#+id/All_Layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_margin="6dp"
android:padding="15dp">
<TextView
android:typeface="normal"
android:layout_gravity="center"
android:id="#+id/prob"
android:textStyle="bold"
android:textColor="#383838"
android:gravity="center"
android:textSize="45sp"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginBottom="8dp"
android:layout_weight="1" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_marginBottom="20dp">
<View
android:layout_height="1dp"
android:layout_width="500dp"
android:background="#000"
android:layout_gravity="center"/>
<TextView
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="O"
android:textSize="40sp"
android:textColor="#color/colorAccent"
android:textStyle="bold"
android:layout_gravity="center"/>
<View
android:layout_height="1dp"
android:layout_width="500dp"
android:background="#000"
android:layout_gravity="center" />
</LinearLayout>
<TextView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="35sp"
android:textStyle="normal"
android:textColor="#383838"
android:id="#+id/sol"
android:typeface="normal"
android:layout_marginBottom="20dp"/>
<View
android:id="#+id/LineHorizontalTwo"
android:layout_height="1dp"
android:layout_width="1000dp"
android:background="#000"
android:layout_gravity="center"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:layout_margin="20dp"
android:layout_gravity="start|center"
android:id="#+id/Like"
android:src="#mipmap/ic_like"
/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:layout_margin="20dp"
android:layout_gravity="end|center"
android:id="#+id/sharesol"
android:src="#mipmap/ic_action_share"/>
</LinearLayout>
</LinearLayout>
</ScrollView>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#mipmap/retry"
android:drawablePadding="10dp"
android:layout_gravity="center"
android:gravity="center"
android:visibility="gone"
android:id="#+id/retry"
android:onClick="onClickRetry"
android:background="#null"
android:padding="6dp"
android:textSize="35sp"
android:text="TRY AGAIN"
android:textColor="#000" />
</LinearLayout>

You can do it simply doing by enclosing your error button inside the Relative Layout as following steps:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<Button
android:id="#+id/retry"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#null"
android:drawablePadding="10dp"
android:drawableTop="#drawable/ic_android"
android:gravity="center"
android:padding="6dp"
android:text="TRY AGAIN"
android:textColor="#000"
android:textSize="35sp"
android:visibility="visible" />
</RelativeLayout>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"/>
also you need a RelativeLayout for parent of this tag

Make the parent layout as RelativeLayout and put everything inside RelativeLayout except the button.
use
<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">
<!--Put your other codes here-->
<!--everything can be within LinerarLayout-->
<Button
android:id="#+id/retry"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#null"
android:drawablePadding="10dp"
android:drawableTop="#mipmap/retry"
android:onClick="onClickRetry"
android:padding="6dp"
android:text="TRY AGAIN"
android:textColor="#000"
android:textSize="35sp"
android:visibility="gone" />
</RelativeLayout>
as your button code

Categories