customizing the default navigation drawer in android like image below or from opening from bottom
screenshot
Here is the main activity layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
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=".NavigationDrawerExample">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="Content" />
</LinearLayout>
<android.support.design.widget.NavigationView
android:layout_width="250dp"
android:background="#android:color/transparent"
android:layout_height="match_parent"
android:layout_gravity="start">
<include layout="#layout/nav_view" />
</android.support.design.widget.NavigationView>
And this is the navigationview.xml
<?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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:gravity="bottom"
android:background="#android:color/transparent"
android:orientation="vertical">
<android.support.v7.widget.CardView
app:cardElevation="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:gravity="center"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
<TextView
android:padding="16dp"
android:text="One"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:padding="16dp"
android:text="One"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:padding="16dp"
android:text="One"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:padding="16dp"
android:text="One"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
You need to use SlidingRootNav use this libs
compile 'com.yarolegovich:sliding-root-nav:1.1.0'
Here is the reference https://github.com/yarolegovich/SlidingRootNav
new SlidingRootNavBuilder(this)
.withMenuLayout(R.layout.menu_left_drawer)
.inject();
Related
Hello I am trying to align a floating action button to the bottom right of the screen but its showing on the right top corner of the screen what can i do to make it to the bottom right?
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="#style/AppTheme"
android:orientation="vertical"
tools:context=".MainActivity">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/createRoomButton"
style="#style/Widget.MaterialComponents.FloatingActionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_margin="16dp"
app:srcCompat="#drawable/ic_add_black_24dp"/>
<SearchView
android:id="#+id/searchInput"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:iconifiedByDefault="false"
android:queryHint="Search Rooms">
<requestFocus />
</SearchView>
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="#+id/pullToRefresh"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ListView
android:id="#+id/roomList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</LinearLayout>
Have made the necessary changes for your UI and now it works perfectly:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="#style/AppTheme"
android:orientation="vertical"
tools:context=".MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/createRoomButton"
style="#style/Widget.MaterialComponents.FloatingActionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="22dp"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
app:srcCompat="#drawable/ic_add_black_24dp"/>
<SearchView
android:id="#+id/searchInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:iconifiedByDefault="false"
android:layout_marginTop="50dp"
android:queryHint="Search Rooms">
<requestFocus />
</SearchView>
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="#+id/pullToRefresh"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ListView
android:id="#+id/roomList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</RelativeLayout>
</LinearLayout>
so I have a problem: I added a LinearLayout with layout_behaviour as BottomSheetBehavior to a FrameLayout view I created and added above one my Activities, but my bottom sheet is not scrollable, I can only change its state programatically but touches don't react. What do you think can be the problem?
This is my xml:
<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/rich_media_container"
android:layout_width="match_parent"
android:layout_height="match_parent">
. . . . . .
<LinearLayout
android:id="#+id/cue_point_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingTop="16dp"
android:paddingBottom="16dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/cue_points_recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="8dp" />
. . . . . .
</LinearLayout>
Use CoordinatorLayout as parent layout.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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">
<include layout="#layout/bottom_sheet" />
</android.support.design.widget.CoordinatorLayout>
bottom_sheet -
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="#+id/bottom_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:behavior_hideable="false"
app:behavior_peekHeight="204dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
.......
</LinearLayout>
you have to use CoordinatorLayout as root layout
activity_main--
<?xml version="1.0" encoding="utf-8"?>
<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"
android:background="#f7f7f7">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="attr/actionBarSize"
android:background="attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main" />
<!-- Adding bottom sheet after main content -->
<include layout="#layout/bottom_sheet" />
</android.support.design.widget.CoordinatorLayout>
bottom_sheet--
<?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:id="#+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fff"
android:orientation="vertical"
android:padding="#dimen/activity_margin"
app:behavior_hideable="true"
app:behavior_peekHeight="56dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="center_vertical"
android:weightSum="3">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/activity_margin"
android:layout_weight="2"
android:text="Order Details"
android:textSize="18dp"
android:textStyle="bold" />
<TextView
android:layout_width="0dp"
android:gravity="right"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textStyle="bold"
android:textSize="15dp"
android:text="₹475.00"></TextView>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Chicken Fried Rice 1x1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Chiken Tikka 1x2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_margin"
android:text="Delivery Address"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Rohini delhi-42" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:background="#000"
android:foreground="?attr/selectableItemBackground"
android:text="PROCEED PAYMENT"
android:textColor="#fff" />
</LinearLayout>
I want to create a layout in which 80% of the Screen Contains separate layout and 20% contains the bottom sheet vertically. But when i try to do it, it gives me error "The view is not a child of CoordinatorLayout". I got the error, but i can't figure out some other way to do it. Can Someone please help me to achieve it. Help will be Appreciated.
<?xml version="1.0" encoding="utf-8"?>
<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"
android:background="#efefef">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="5">
<include
layout="#layout/content_main_new"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4" />
<include
layout="#layout/content_bottom_sheet2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
content_bottom_sheet2.xml
<?xml version="1.0" encoding="utf-8"?>
<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">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/bottomSheetLayout"
android:layout_width="match_parent"
android:layout_height="230dp"
android:background="#color/colorPrimary"
android:orientation="vertical"
android:padding="#dimen/activity_vertical_margin"
app:behavior_peekHeight="90dp"
app:layout_behavior="#string/bottom_sheet_behavior">
<!--android:background="#android:color/holo_orange_light"-->
<android.support.v7.widget.CardView
android:id="#+id/cvBottomCard"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="#dimen/spIconsize"
android:visibility="visible"
app:cardBackgroundColor="#color/white"
app:cardCornerRadius="10dp"
app:cardElevation="5dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:paddingTop="10dp"
android:orientation="horizontal">
<Button
android:layout_marginBottom="5dp"
android:id="#+id/btnReview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="15dp"
android:layout_weight="1"
android:background="#drawable/rounded_button_darkgreen_bg"
android:text="Review"
android:textColor="#color/white" />
<Button
android:layout_marginBottom="5dp"
android:id="#+id/btnReschedule"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_weight="1"
android:background="#drawable/rounded_button_grey"
android:text="Reschedule"
android:textColor="#color/white" />
</LinearLayout>
<RelativeLayout
android:id="#+id/relLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/linearLayout"
android:layout_marginTop="5dp"
android:padding="10dp"
android:visibility="visible">
<ImageButton
android:id="#+id/imageButton"
android:layout_width="80dp"
android:layout_height="90dp"
android:src="#drawable/user"
android:visibility="gone" />
<TextView
android:id="#+id/tvappointmentId"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toEndOf="#+id/imageButton"
android:text="Appointment ID - 5727"
android:textColor="#color/black" />
<TextView
android:id="#+id/tvCustomerName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvappointmentId"
android:layout_toEndOf="#+id/imageButton"
android:text="Name - Virat Sharma"
android:textColor="#color/black" />
<TextView
android:id="#+id/tvLoanType"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvCustomerName"
android:layout_toEndOf="#+id/imageButton"
android:text="Loan Type - Home LOAN" />
<TextView
android:id="#+id/tvLoanAmount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvLoanType"
android:layout_toEndOf="#+id/imageButton"
android:text="Loan Amount - 5727" />
<TextView
android:id="#+id/tvTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/tvappointmentId"
android:layout_alignBottom="#+id/tvappointmentId"
android:layout_alignParentEnd="true"
android:gravity="right"
android:text="01:22 Mins"
android:textColor="#color/red_error"
android:textStyle="bold"
android:visibility="gone" />
</RelativeLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
Can you try this way, please?
<?xml version="1.0" encoding="utf-8"?>
<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/bottomSheetLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:behavior_peekHeight="90dp"
app:layout_behavior="#string/bottom_sheet_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="230dp"
android:background="#color/colorPrimary"
android:orientation="vertical"
android:padding="#dimen/activity_vertical_margin">
...
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
All that I have done is to put the id that you will call later as your bottom sheet in the root element (Which by the way could be a ConstraintLayout if you want), as you can notice, the parent of this root element will be automatically a CoodinatorLayout.
The second thing is to put this element with a height wrap_content
The layout behaviour should be in the root element, too. app:layout_behavior="#string/bottom_sheet_behavior"
What I want is for qrcodetext to fit and display all the text in qrcode_layout and have qrimageView to fill the rest of qrcode_layout? But my layout below has the entire qrimageView cover qrcode_layout. I tried a bunch of other variations but without success.
Here is what it looks like.
Here is what I want it to look like.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:id="#+id/qrcodelayout">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/qrimageView"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/qrcodetext"
android:gravity="center"
android:layout_gravity="center_horizontal"
android:layout_marginTop="4dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</RelativeLayout>
Use following code. Align your textview to bottom and then align your Qrcode Image above text:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/qrcodetext"
android:gravity="center"
android:layout_alignParentBottom="true"
android:layout_marginTop="4dp" />
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/qrimageView"
android:layout_gravity="center_horizontal"
android:layout_above="#id/qrcodetext"
android:layout_alignParentTop="true"
android:layout_marginTop="8dp" />
</RelativeLayout>
I think what i have understand you want is below: Plz check and tell me:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:id="#+id/qrcodelayout">
<TextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/qrcodetext"
android:gravity="center"
android:layout_weight="1"
android:layout_gravity="center_horizontal"
android:layout_marginTop="4dp" />
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/qrimageView"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp" />
</LinearLayout>
</LinearLayout>
<!--<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>-->
</RelativeLayout>
Here is my main xml file
<?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:id="#+id/view"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/tool_bar"
layout="#layout/tool_bar"></include>
<android.support.v4.widget.DrawerLayout
android:layout_below="#+id/tool_bar"
android:id="#+id/DrawerLayout"
android:elevation="7sp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tool_bar"
android:text="#string/hello_world" />
<android.support.v7.widget.RecyclerView
android:id="#+id/RecycleView"
android:layout_width="288dp"
android:background="#ffffff"
android:layout_height="match_parent"
android:layout_gravity="left"
android:scrollbars="vertical"
android:focusable="true"
android:clickable="true">
</android.support.v7.widget.RecyclerView>
</android.support.v4.widget.DrawerLayout>
</RelativeLayout>
Here is my item_row.xml file
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:layout_height="wrap_content"
android:background="#ffffff"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/rowIcon"
android:paddingLeft="16dp"
android:src="#drawable/ic_launcher"/>
<com.balysv.materialripple.MaterialRippleLayout
android:id="#+id/ripple"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="12dp"
android:paddingTop="4dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Medium Text"
android:id="#+id/rowText" />
</com.balysv.materialripple.MaterialRippleLayout>
</LinearLayout>
I am using the libray https://github.com/balysv/material-ripple
When I am not using the library the click is working fine but when using the library I did not receive any touch feedback.
Please help me on this.
Try to wrap your item_row.xml with the MaterialRippleLayout. Basically set it as your parent layout to receive the click from the user. Try this:
<?xml version="1.0" encoding="utf-8"?>
<com.balysv.materialripple.MaterialRippleLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/ripple"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:background="#ffffff"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:mrl_rippleColor="#80000000"
app:mrl_rippleOverlay="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/rowIcon"
android:paddingLeft="16dp"
android:src="#drawable/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="12dp"
android:paddingTop="4dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Medium Text"
android:id="#+id/rowText" />
</LinearLayout>
</com.balysv.materialripple.MaterialRippleLayout>