Recycler View Position Bottom of ImageView - java

I'm learning Android Material from Slidenerd's video on Youtube. I got a problem when learn to make Recycler View on Drawer. But the position of Recycler View can't bottom of Image View. I want to throw that after the ImageView like another Material Design app. Let see the screenshot.
This is my code:
fragment_navigation_drawer.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#EEE"
tools:context="com.balinez.wdharmana.doahindu.NavigationDrawerFragment">
<LinearLayout
android:id="#+id/containerDrawerImage"
android:background="#F88C00"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- TODO: Update blank fragment layout -->
<ImageView
android:layout_width="280dp"
android:layout_height="140dp"
android:layout_marginBottom="18dp"
android:src="#drawable/bg_galungan"
/>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/drawer_list"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</android.support.v7.widget.RecyclerView>
</FrameLayout>
custom_row.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:padding="8dp"
android:id="#+id/listIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_bookmark1"
android:layout_gravity="center_vertical"
/>
<TextView
android:id="#+id/listText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Doa Sehari-hari"
android:layout_gravity="center_vertical"
/>
</LinearLayout>
Activity_main.xml
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<include android:id="#+id/app_bar"
layout="#layout/app_bar" style="#style/AppTheme.Base" />
<TextView
android:layout_below="#+id/app_bar"
android:text="#string/hello_world" android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
<fragment
android:layout_width="#dimen/nav_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="start"
android:id="#+id/fragment_navigation_drawer"
app:layout="#layout/fragment_navigation_drawer"
android:name="com.balinez.wdharmana.doahindu.NavigationDrawerFragment"
tools:layout="#layout/fragment_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>
Let's share if you also has same problem. Thanks for advance !

If it really not necessary to user FrameLayout as your parent, you can use RelativeLayout like I used.
<?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"
android:background="#EEE"
tools:context="com.balinez.wdharmana.doahindu.NavigationDrawerFragment">
<LinearLayout
android:id="#+id/containerDrawerImage"
android:background="#F88C00"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<!-- TODO: Update blank fragment layout -->
<ImageView
android:layout_width="280dp"
android:layout_height="140dp"
android:layout_marginBottom="18dp"
android:src="#drawable/beach"
/>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/drawer_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/containerDrawerImage"
>
</android.support.v7.widget.RecyclerView>
</RelativeLayout>

Related

How to make a Sliding Up Panel in Android?

I want to add a Sliding up Panel in my project. But I am not sure how to do that. I want to add the sliding panel in my following layout:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/mainFragment"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#F7FEFF"
tools:context="app.meetgreet.meetgreet.MainActivity">
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="app.meetgreet.meetgreet.MapsActivity" />
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:textColor="#color/colorAccent"
android:textSize="30sp"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="#+id/scrollView2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/scrollView2"
app:layout_constraintVertical_bias="0.36" />
<ScrollView
android:id="#+id/scrollView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<LinearLayout
android:id="#+id/linearLayoutMain"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="vertical" />
</ScrollView>
<ImageButton
android:id="#+id/imageButton"
style="#style/Widget.AppCompat.ImageButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:background="#android:color/transparent"
android:contentDescription="#string/settings"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_icons8_benutzereinstellungen_64" />
</androidx.constraintlayout.widget.ConstraintLayout>
I already implemented the library to do that:
implementation 'com.sothree.slidinguppanel:library:3.4.0'
The following part should be the mainLayout. So it is not part of the sliding panel. It provides a google map.
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="app.meetgreet.meetgreet.MapsActivity" />
All other views but the ImageButton should be part of the sliding panel. The ImageButton should be on the top of the Screen and disappear if the Panel reaches the top. I hope someone can help me to implement that!
I already tried to do that as described on GitHub:
https://github.com/umano/AndroidSlidingUpPanel
Anyway, it doesn't work.
Thanks!
Here is a simple example
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<com.sothree.slidinguppanel.SlidingUpPanelLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/slide_up"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
tools:context=".MainActivity"
app:umanoPanelHeight="70dp"
app:umanoShadowHeight="5dp">
<!-- main content -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="app.meetgreet.meetgreet.MapsActivity" />
</RelativeLayout>
<!-- sliding part -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="#layout/example" />
</RelativeLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>
example.xml
<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" >
<!-- this is the header-->
<LinearLayout
android:id="#+id/header_layout"
android:layout_width="match_parent"
android:layout_height="70dp"
android:orientation="horizontal"
android:clickable="true"
android:background="#color/backgroundColor"
android:gravity="center">
<!-- some views here -->
</LinearLayout>
<!-- this is the content -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true">
<!-- some views -->
</RelativeLayout>
</RelativeLayout>

using textIsSelectable in textView

I use android:textIsSelectable="true" for TextView.
To enabled copy/select/paste For TextView it is OK
Issue
When I open this activity, it scrolls to middle automatically, like this Link
Why did this problem happen?
This is my layout code.
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:bind="http://schemas.android.com/apk/res/android" >
<data>
<variable
name="aboutMbti"
type="mbtitest.kiars.me.mbti.model.AboutMbti"/>
</data>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardBackgroundColor="#android:color/white"
app:cardCornerRadius="2dp"
app:cardElevation="5dp" >
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:fitsSystemWindows="true"
android:scrollbarSize="1dp"
android:scrollbarThumbVertical="#android:color/white">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/img_splash_mtbi"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_margin="3dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="centerCrop"
bind:imageUrl="#{aboutMbti.imageUrl}"/>
<TextView
android:id="#+id/txt_content_about_mtbi"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/img_splash_mtbi"
android:layout_margin="5dp"
android:textIsSelectable="true"
android:padding="#dimen/title_padding"
android:text="#{aboutMbti.textContent}"
android:textColor="#color/ques_title"
android:textSize="15sp"
android:textStyle="bold"/>
</RelativeLayout>
</androidx.core.widget.NestedScrollView>
</androidx.cardview.widget.CardView>
</RelativeLayout>
</layout>
Solution
You can add either android:focusableInTouchMode="true" or android:descendantFocusability="blocksDescendants" to the child layout in NestedScrollView
Try below code in your layout:
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
...... >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusableInTouchMode="true" >
...........
Finally, According to https://stackoverflow.com/users/6891563/khemraj comment, I Find
Mey solution ...
Just add android:focusableInTouchMode="true" to ImageView Like this :
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:bind="http://schemas.android.com/apk/res/android" >
<data>
<variable
name="aboutMbti"
type="mbtitest.kiars.me.mbti.model.AboutMbti"/>
</data>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardBackgroundColor="#android:color/white"
app:cardCornerRadius="2dp"
app:cardElevation="5dp" >
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:fitsSystemWindows="true"
android:scrollbarSize="1dp"
android:scrollbarThumbVertical="#android:color/white">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/img_splash_mtbi"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_margin="3dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:focusableInTouchMode="true"
android:scaleType="centerCrop"
bind:imageUrl="#{aboutMbti.imageUrl}"/>
<TextView
android:id="#+id/txt_content_about_mtbi"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/img_splash_mtbi"
android:layout_margin="5dp"
android:textIsSelectable="true"
android:padding="#dimen/title_padding"
android:text="#{aboutMbti.textContent}"
android:textColor="#color/ques_title"
android:textSize="15sp"
android:textStyle="bold"/>
</RelativeLayout>
</androidx.core.widget.NestedScrollView>
</androidx.cardview.widget.CardView>
</RelativeLayout>
</layout>
Tnx Guys

Prevent FAB from going down when scrolling in RecyclerView in fragment

I'm new to android development and recently learning about fragments.
I have a recyclerview inside fragment, and I want it to be attached to the toolbar, I tried put app:layout_behavior="#string/appbar_scrolling_view_behavior"
inside the container layout but whenever the toolbar shows the FAB moves down below the navigation bar as you can see here.
activity_main.XML
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
android:id="#+id/main_screen"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.atar.mango.MainActivity">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="#layout/toolbar"/>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/logo_header"
app:menu="#menu/menu_for_navigation_view"/>
</android.support.v4.widget.DrawerLayout>
home_fragment.XML
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.atar.mango.HomeFragment"
android:background="#color/background">
<TextView
android:id="#+id/empty"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/empty"
android:gravity="center"
android:textSize="90sp"
android:textColor="#32000000"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/notes"
app:backgroundTint="#color/background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none"
android:overScrollMode="never">
</android.support.v7.widget.RecyclerView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/add_note"
app:backgroundTint="#color/options"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginRight="#dimen/fab_margin_right"
android:layout_marginEnd="#dimen/fab_margin_right"
app:layout_anchorGravity="bottom|right|end"
android:layout_marginBottom="16dp"
android:src="#mipmap/add_note"
app:borderWidth="0dp"
android:elevation="6dp"
app:pressedTranslationZ="12dp"
app:fabSize="normal"/>
</android.support.design.widget.CoordinatorLayout>
Thanks.
I think you must specify your layout target,
in this way:
<android.support.design.widget.FloatingActionButton
...
android:layout_gravity="bottom|end|right"
app:layout_anchor="#id/notes"
app:layout_anchorGravity="bottom|right|end"
/>

how to scroll over image in recycler view

I am new to android programming and I am trying to scroll my recycler view over image
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rootRL"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="160dp"
android:background="#drawable/mydrawable">
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="160dp"
android:id="#+id/rv"/>
</FrameLayout>
When I scroll ,the recycler view scrolls under the image not over it.How can i achieve this effect ?
Try this:-
Using FrameLayout by setting backgroundImage:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rootRL"
android:layout_width="match_parent"
android:layout_height="160dp"
android:layout_marginTop="160dp"
android:background="#drawable/tips"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
Using LinearLayout by setting backgroundImage:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rootRL"
android:layout_width="match_parent"
android:layout_height="160dp"
android:layout_marginTop="160dp"
android:background="#drawable/tips"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
Using RelativeLayout by setting backgroundImage:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rootRL"
android:layout_width="match_parent"
android:layout_height="160dp"
android:layout_marginTop="160dp"
android:background="#drawable/tips">
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
Using RelativeLayout with ImageView:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rootRL"
android:layout_width="match_parent"
android:layout_height="160dp"
android:layout_marginTop="160dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/tips" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>

how to add a box over card view on selection?

I have a list of hours created with card view and recycler view. I want to show the changes on some selection of hours. on selection I want to show type of blue box in image. How can I achieve it??
I think I need to add multiple layouts in the parent layout and change the background color of the layouts. Is it a right way?? Or is it possible with any other way???
card layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_blue_light">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:id="#+id/relativeLayout"
android:layout_alignParentTop="true">
<ImageView
android:layout_width="280dp"
android:layout_height="2dp"
android:id="#+id/imageView"
android:background="#drawable/lineh"
android:layout_marginRight="20dp"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Small Text"
android:id="#+id/txthour"
android:layout_marginLeft="10dp"
android:layout_centerVertical="true"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
Main Layout
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/nav_drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id = "#+id/toolbar_container">
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"/>
<FrameLayout
android:id="#+id/nav_contentframe"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/background_light"
android:layout_below="#+id/toolbar">
</FrameLayout>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/drawer_header"
app:menu="#menu/nav_menu"
android:background="#android:color/background_light" />
</android.support.v4.widget.DrawerLayout>
Fragment 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" tools:context="com.example.siddhi.timetablelayout.List"
android:background="#android:color/holo_blue_bright">
<android.support.v7.widget.RecyclerView
android:layout_height="match_parent"
android:layout_width="match_parent"
android:id="#+id/RecyclerView"
android:background="#android:color/white"
android:layout_weight="1.40"
android:layout_gravity="right|bottom" />
</FrameLayout>
Please help...
I would recommend you to use a custom view(or layout that is, obviously, also a view) for this purpose. What you need to do is override onDraw method:
#Override
public void onDraw(Canvas canvas){
super.onDraw(canvas);
drawOverlay(canvas);
}
In this case you need to setup all overlay params for your view and after that just draw on canvas a selection. Here is a good article about it.

Categories