We Keep Coding

I'm making a mistake somewhere while making a simple design

no matter what I do in my design, I want to center what I wrote with the photographs, but I cannot do the design, I wonder where I am going wrong I'm learning new and tried to make a design like in the photo
I'll create the rest using the recycler view and card view
Enough explanation, I hope I don't want to confuse you
<androidx.cardview.widget.CardView 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">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView6"
android:layout_width="60dp"
android:layout_height="60dp"
android:contentDescription="TODO" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/textView4"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="text" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/textView5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Date" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal">
<TextView
android:id="#+id/textView3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="text" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView7"
android:layout_width="60dp"
android:layout_height="60dp"" />
</LinearLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>

Splitted the center part to two linear layouts. Also added android:gravity="center|bottom" to the TextView which contains the date.
<androidx.cardview.widget.CardView 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">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView6"
android:layout_width="60dp"
android:layout_height="60dp"
android:contentDescription="TODO" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="text" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="text" />
</LinearLayout>
<TextView
android:id="#+id/textView5"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center|bottom"
android:text="Date" />
</LinearLayout>
<ImageView
android:id="#+id/imageView7"
android:layout_width="60dp"
android:layout_height="60dp" />
</LinearLayout> </androidx.cardview.widget.CardView>
Here's how it looks like. I added some colors so it's easier to see where layouts begin and end. The colors are not part of the xml.

Admob showing only on top of XML

I tried to integrate AdMob into my XML, but it only shows the ad at the top of the application.
Image
In Android Studio, it appears in the correct location:
Android Studio
My XML:
<FrameLayout xmlns:ads="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/overlayContainer"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:ignore="UselessParent">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary">
<TextView
android:id="#+id/bVersion"
style="#style/FakeSpinner"
android:layout_width="72dp"
android:layout_height="match_parent"
android:layout_gravity="end"
android:gravity="center"
android:textStyle="bold"
tools:text="VERSNM" />
<my.app.base.widget.NavFrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<my.app.base.widget.GotoButton
android:id="#+id/bGoto"
style="?actionButtonStyle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="#dimen/nav_goto_side_margin"
android:layout_marginEnd="#dimen/nav_goto_side_margin"
android:fontFamily="sans-serif-medium"
android:includeFontPadding="false"
android:paddingStart="0dp"
android:paddingEnd="0dp"
android:textSize="16sp"
tools:text="Long Name Of Book 123" />
<ImageButton
android:id="#+id/bLeft"
style="?actionButtonStyle"
android:layout_width="#dimen/nav_prevnext_width"
android:layout_height="match_parent"
android:layout_gravity="start"
android:contentDescription="#string/desc_previous_chapter"
android:scaleType="center"
android:src="#drawable/ic_nav_start_light" />
<ImageButton
android:id="#+id/bRight"
style="?actionButtonStyle"
android:layout_width="#dimen/nav_prevnext_width"
android:layout_height="match_parent"
android:layout_gravity="end"
android:contentDescription="#string/desc_next_chapter"
android:padding="16dp"
android:scaleType="center"
android:src="#drawable/ic_nav_end_light" />
</my.app.base.widget.NavFrameLayout>
</androidx.appcompat.widget.Toolbar>
<my.app.base.widget.TwofingerLinearLayout
android:id="#+id/splitRoot"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical"
tools:ignore="NestedWeights">
<my.app.base.verses.EmptyableRecyclerView
android:id="#+id/lsSplitView0"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:paddingStart="#dimen/text_side_padding"
android:paddingEnd="#dimen/text_side_padding"
android:scrollbarStyle="outsideOverlay"
android:scrollbars="vertical" >
</my.app.base.verses.EmptyableRecyclerView>
<my.app.base.widget.LabeledSplitHandleButton
android:id="#+id/splitHandleButton"
android:layout_width="match_parent"
android:layout_height="#dimen/split_handle_thickness"
android:background="#null"
android:visibility="gone" />
<my.app.base.verses.EmptyableRecyclerView
android:id="#+id/lsSplitView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:paddingStart="#dimen/text_side_padding"
android:paddingEnd="#dimen/text_side_padding"
android:scrollbarStyle="outsideOverlay"
android:scrollbars="vertical" />
</my.app.base.widget.TwofingerLinearLayout>
<com.google.android.gms.ads.AdView
android:id="#+id/adView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
ads:adSize="FULL_BANNER"
ads:adUnitId="AD-UNIT-ID">
</com.google.android.gms.ads.AdView>
</LinearLayout>
<my.app.base.widget.Floater
android:id="#+id/floater"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="8dp"
android:visibility="gone" />
</FrameLayout>
It only appears at the top in the running application, already in Android Studio, it appears in the location I want. How do I leave this AdMob ad at the end as it is in Android Studio?

when using a FrameLayout ViewGroup in android, you have to specify the layout_gravity of its children. if u dont, the frame layout moves the child View to the Top which is the default gravity for the children in a FrameLayout. To correct this all you have to do is
set the layout_gravityof the LinearLayout to bottom just like this
since the LinearLayout is the parent of the admob add this
android:layout_gravity = "bottom" to LinearLayout just after android:orientation = "vertical" or any where you would like it to be within the LinearLayout ViewGroup.

How to slow down the Scrolling speed of Recyclerview both in vertically and horizontally?

In My Android project I am using RecyclerView inside one layout. Here is the code given below-
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:custom="http://schemas.android.com/apk/res-auto"
tools:context=".ui.reader.pageview.PageViewFragment">
<TextView
android:id="#+id/tv_test"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<android.support.v7.widget.RecyclerView
android:overScrollMode="never"
android:id="#+id/rv_page_view"
android:layout_below="#id/pb"
android:layout_above="#+id/ll_page_controller_bottom"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
<LinearLayout
android:background="#color/colorWhite"
android:orientation="vertical"
android:id="#+id/ll_page_controller_bottom"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#DADADA" />
<org.adw.library.widgets.discreteseekbar.DiscreteSeekBar
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:id="#+id/seek_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:dsb_indicatorColor="#color/colorOrange"
app:dsb_trackColor="#color/colorOrange"
app:dsb_progressColor="#color/colorOrange"
app:dsb_rippleColor="#color/colorGray"
app:dsb_min="0"
app:dsb_max="100"/>
<TextView
android:layout_marginTop="-10dp"
android:layout_marginBottom="5dp"
android:text="1"
android:id="#+id/tv_page_number"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<View
android:layout_below="#id/pb"
android:layout_above="#id/ll_page_controller_bottom"
android:id="#+id/view_touch"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<RelativeLayout
android:visibility="invisible"
android:id="#+id/rl_settings"
android:layout_alignParentEnd="true"
android:layout_below="#id/pb"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<include layout="#layout/reader_settings"/>
</RelativeLayout>
<TextView
android:layout_margin="10dp"
android:layout_below="#id/pb"
android:id="#+id/tv_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textSize="16sp"
android:visibility="invisible"
android:layout_above="#id/ll_page_controller_bottom"/>
</RelativeLayout>
Now, for rendering a lot of data when the users scrolls too much fast the screen got hanged. So, I want to slow down the speed of the scrolling.
I have tried the following solution-
How can i control the scrolling speed of recyclerView.smoothScrollToPosition(position)
It works well with horizontal scrolling but when I switch to vertical view then It doesn't work.
Is there any way to solve this?

How to design this Grid view xml page?

I want to design xml page this type. I tried many of the code. Every time new problems are come. I need bottom navigation bar is fixed. In grid view ,i want android:numColums=3, android:verticalSpacing and android:horizontalSpacing Same(Look like instagram profile view grid images ).
XMl Code:
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainSettingClass">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="175dp"
android:background="#dadada"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/profile_image"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="#drawable/com_facebook_button_background"/>
<TextView
android:id="#+id/amsc_txt_fbusername"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="TextView"
android:layout_marginTop="2dp" />
</LinearLayout>
<GridView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/grid_test"
android:verticalSpacing="2dp"
android:horizontalSpacing="2dp"
android:background="#FFFFFF"
android:stretchMode="columnWidth"
android:columnWidth="85dp"
android:numColumns="3"/>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_gallery"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#ffffff"
app:menu="#menu/bottom_navigation_gallery"/>
</FrameLayout>

As per your design you need scrollview for 2 above components and your BottomNavigationView is fix (not movable).
In your code you are not using scrollview first and second i'm not sure why you're using framelayout!
Here's my code which is exactly as per your given design try this if any concern you can ask! :)
Here's my code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottom_gallery">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/rel_titleHolder"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#dadada"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/profile_image"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/amsc_txt_fbusername"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:gravity="center"
android:text="TextView" />
</LinearLayout>
<GridView
android:id="#+id/grid_test"
android:layout_width="match_parent"
android:layout_height="400dp"
android:columnWidth="85dp"
android:horizontalSpacing="2dp"
android:numColumns="3"/>
</LinearLayout>
</ScrollView>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_gallery"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:layout_alignParentBottom="true" />
</RelativeLayout>

Error when use android.support.design.widget.CoordinatorLayout

I'm new android dev. I have tried to work with
<android.support.design.widget.CoordinatorLayout>
and here is my XML code.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.ducbo.flynow_ver20.payment_section">
<LinearLayout
android:id="#+id/payment_header"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#drawable/background_header">
<Button
android:id="#+id/payment_btn_back"
android:layout_width="15dp"
android:layout_height="30dp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="15dp"
android:background="#drawable/btnback" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="27dp"
android:layout_toRightOf="#id/payment_btn_back"
android:layout_weight="12"
android:gravity="center_horizontal"
android:text="#string/thanh_toan"
android:textColor="#color/white"
android:textSize="28sp" />
</LinearLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/payment_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/payment_header">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/payment_types"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:padding="15dp"
android:text=""
android:textSize="16sp" />
<LinearLayout
android:id="#+id/payment_types_container"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/payment_tab_method"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/payment_types">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<!--<android.support.v7.widget.Toolbar-->
<!--android:id="#+id/toolbar"-->
<!--android:layout_width="match_parent"-->
<!--android:layout_height="?attr/actionBarSize"-->
<!--app:layout_scrollFlags="scroll|enterAlways"-->
<!--app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />-->
<!--android:background="?attr/colorPrimary"-->
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="90dp"
android:background="#color/white"
app:tabGravity="fill"
app:tabMode="fixed" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
<include
android:id="#+id/payment_table_passenger"
layout="#layout/table_passenger"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/payment_types_container"></include>
<include
android:id="#+id/payment_startdp"
layout="#layout/fm_booking_startdp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/payment_table_passenger"></include>
<include
android:id="#+id/payment_enddp"
layout="#layout/fragment_booking_enddp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/payment_startdp">
</include>
<Button
android:id="#+id/payment_btn_submit"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/payment_enddp"
android:layout_marginBottom="15dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="15dp"
android:background="#drawable/border_orange"
android:text="Continue"
android:textColor="#color/white" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
With each tab, I used one fragment to show tab's content. After that, I included some layout below Coordinator but it wasn't appear below Coordinator. When I checked again in Design tab on Android studio, I realized that the height of coordinator seemingly unlimited even though I set wrap_content for it. I think that is problem and I have changed height attribute of Coordinator to specific number and my input layout appeared but I don't want like this. What can I fix the height of Coordinator to wrap content?