Xamarin Designer throws exception - xamarin

I'm working on a current project using Xamarin.Android. I got several view sthat use the same layout. I got used to define everything in a style for this while working with Android Studio. The problem is that Xamarin's Designer doesn't accept that "layout_width" and "layout_height" are defined in a style.
Of course it is a possibility to define those with the views, but it would increase the lines of XML-code quite a bit, and also I'd have to change more than one view if I'd change something.
I already looked into the topic but didn't find a workaround. Maybe someone got a similar problem and might have found a proper solution.
Fragment_Therapist.axml
<?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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:weightSum="7">
<RelativeLayout
android:layout_weight="2"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="#android:drawable/ic_menu_gallery"
android:layout_width="250dp"
android:layout_height="250dp"
android:id="#+id/profile_icon"
android:layout_marginTop="30dp"
android:layout_centerHorizontal="true" />
<!-- Profile Name -->
<RelativeLayout
android:id="#+id/sublayout_I"
android:layout_marginTop="25dp"
android:layout_marginLeft="100dp"
android:layout_marginRight="100dp"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_below="#id/profile_icon">
<TextView
android:id="#+id/profile"
android:text="#string/therapistfragment_profile"
android:textColor="#000000"
android:textStyle="bold"
android:minWidth="50dp"
android:textSize="25dp" />
<TextView
android:id="#+id/profile_name"
android:textColor="#000000"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
<!-- Profile Description-->
<RelativeLayout
android:id="#+id/sublayout_II"
android:layout_marginTop="25dp"
android:layout_marginLeft="100dp"
android:layout_marginRight="100dp"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_below="#id/sublayout_I">
<TextView
android:id="#+id/description"
android:textColor="#000000"
android:textStyle="bold"
android:minWidth="50dp"
android:text="#string/therapistfragment_description"
android:textSize="25dp" />
<TextView
android:id="#+id/profile_description"
android:textColor="#000000"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
</RelativeLayout>
<!-- Edit, Info, Delete, Cancel and Save-->
<LinearLayout
android:layout_weight="5"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="2">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_weight="1"
android:weightSum="2">
<RelativeLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_weight="1">
<Button
android:id="#+id/edit"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_marginBottom="15dp"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:layout_marginTop="15dp" />
</RelativeLayout>
<RelativeLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_weight="1">
<Button
android:id="#+id/info"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_marginBottom="15dp"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:layout_marginTop="15dp" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_weight="1"
android:weightSum="4">
<LinearLayout
android:id="#+id/left"
style="#style/PlaceHolder" />
<RelativeLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_weight="2">
<Button
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_marginBottom="15dp"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:layout_marginTop="15dp" />
</RelativeLayout>
<LinearLayout
android:id="#+id/right"
style="#style/PlaceHolder" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
styles.xml
<?xml version="1.0" encoding="utf-8" ?>
<resources>
<style name="PlaceHolder">
<item name="android:layout_height">match_parent</item>
<item name="android:layout_width">match_parent</item>
<item name="android:layout_weight">1</item>
</style>
</resources>

Related

Xamarin Tabhost - overlapped tab content

I created a tabbed application using TabHost widget, from Xamarin.
When I am changing the tabs, they are overlapping.
https://imgur.com/a/cfRWlsl
This is the layout for the main page.
I have the tabs at the buttom of the screen and the content of the tabs above.
The tabs are created dynamically.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<FrameLayout
android:id="#+id/actualtabcontent"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_above="#+id/tabContainer"/>
<LinearLayout android:id="#+id/tabContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<TabHost android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/fullOpacityBlack">
<LinearLayout android:orientation="vertical"
android:layout_width="match_parent" android:layout_height="match_parent">
<TabWidget android:id="#android:id/tabs"
android:orientation="horizontal"
android:layout_width="match_parent" android:layout_height="90dp"
android:layout_weight="0"
android:layout_alignParentBottom="true"
android:background="#color/fullOpacityBlack" />
<FrameLayout android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
</TabHost>
</LinearLayout>
</RelativeLayout>

Change Background Color of MvxItemTemplate?

How does one change the Background Color of an MvxItemTemplate?
I can change the Background of the MvxListView, but that changes the background of all the elements.
Here's the relevant code:
<MvvmCross.Binding.Droid.Views.MvxListView
android:id="#+id/favoritesList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
local:MvxItemTemplate="#layout/template_screen"
local:MvxBind="ItemsSource FavoritesGroupedList; ItemClick ScreenSelectedCommand; ItemLongClick ShowUnFavoriteCommand" />
If I place BackgroundColor BlackOrBlueColor(IsUnFavorite) in the local:MvxBind for the ListView, it works. I tried to place the Binding in my template:
?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:id="#+id/screenIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
local:MvxBind="BackgroundColor BlackOrBlueColor(IsUnFavorite)"/>
<TextView
android:id="#+id/screenText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp" />
</LinearLayout>
But it doesn't work.
You can't change the MvxItemTemplate background color, but you can change the background color of the root layout inside the item template:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
local:MvxBind="BackgroundColor BlackOrBlueColor(IsUnFavorite)">

Add ripple effect to a listview

I am trying to add ripple effect to MvxListView but its not coming. Here is the layout.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/orientedlayout"
android:minWidth="25px"
android:minHeight="25px"
android:baselineAligned="false">
<LinearLayout
android:layout_weight="0.4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:id="#+id/linearLayout2"
android:orientation="vertical"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.3"
android:id="#+id/linearLayout2">
<cgs.bw.droid.CustomCalendar
android:id="#+id/customcalender"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="0.7" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.7"
android:weightSum="2"
android:id="#+id/linearLayout2"
android:orientation="vertical"
android:layout_marginTop="5dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="56dp"
android:gravity="center_vertical"
android:textAlignment="center">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:gravity="center"
android:id="#+id/txtActivity"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="#string/strActivity"
android:textSize="#dimen/textsize_medium"
android:tag="RobotoCondensedBold"
android:layout_weight="1"
android:textColor="#9b9b9b"
android:textColorLink="#7e1664"
android:layout_marginLeft="10dp" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:id="#+id/viewActivity"
android:background="#7e1664"
android:layout_marginLeft="10dp" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp">
<TextView
android:id="#+id/txtNews"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="#string/strNews"
android:textSize="#dimen/textsize_medium"
android:tag="RobotoCondensedBold"
android:layout_weight="1"
android:textColor="#9b9b9b"
android:textColorLink="#7e1664"
android:paddingLeft="10dp" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:id="#+id/viewNews"
android:background="#7e1664"
android:layout_marginLeft="10dp" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#e3e3e3" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="0dp"
android:layout_weight="1.6"
android:id="#+id/ActivityLinLayout"
android:minHeight="80dp">
<TextView
android:text="#string/NoActivityFeed"
android:layout_width="match_parent"
android:layout_height="wrap_content"
local:MvxBind="Visible (ActivityfeedData.Count==0)"
android:gravity="center"
android:textSize="#dimen/textsize_login" />
<FrameLayout
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Mvx.MvxListView
local:MvxBind="ItemsSource ActivityfeedData ; ItemClick ShowDetails,Mode=TwoWay"
local:MvxItemTemplate="#layout/homeactivity_itemtemplate"
android:minWidth="25px"
android:minHeight="25px"
android:listSelector="#drawable/list_selector"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:drawSelectorOnTop="true"/>
</FrameLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content"
android:id="#+id/NewsLinLayout"
android:layout_weight="1.6"
android:minHeight="80dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="right">
<ImageView
android:src="#drawable/gear_icon_states"
android:layout_width="20dp"
android:layout_height="20dp"
android:id="#+id/imageView1"
local:MvxBind="Click EditFeedList"
android:layout_gravity="right"
android:padding="5dp"
android:layout_alignParentRight="true" />
<TextView
android:text="#string/NoNews"
android:layout_width="match_parent"
android:layout_height="wrap_content"
local:MvxBind="Visible (FeedItemsTotal.Count==0)"
android:gravity="center"
android:textSize="#dimen/textsize_login" />
<FrameLayout xmlns:tools="http://schemas.android.com/tools"
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
tools:visibility="visible">
<Mvx.MvxListView
local:MvxBind="ItemsSource FeedItemsTotal; ItemClick ShowNewsDetail,Mode=TwoWay"
local:MvxItemTemplate="#layout/homenewsfeedtemplate"
android:minWidth="25px"
android:minHeight="25px"
android:listSelector="#drawable/list_selector"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true" />
</FrameLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_weight="0.6"
android:layout_width="0dp"
android:orientation="vertical"
android:layout_height="match_parent"
android:id="#+id/linearLayout1"
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.2">
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.8"
android:textAlignment="center"
android:gravity="left"
android:layout_gravity="center"
android:layout_marginLeft="10dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:gravity="center"
android:id="#+id/txtAllEventsAndMeetings"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="#string/strAll"
android:layout_weight="1"
local:MvxBind="Click GoFetchAllMeetingAndEvents"
android:textSize="#dimen/textsize_medium"
android:tag="RobotoCondensedBold"
android:textColor="#9b9b9b"
android:textColorLink="#7e1664" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:id="#+id/viewAllEventsAndMeetings"
android:background="#7e1664" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:gravity="center"
android:id="#+id/txtEvents"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/strEvents"
android:layout_weight="1"
local:MvxBind="Click GoFetchAllEvents"
android:textSize="#dimen/textsize_medium"
android:tag="RobotoCondensedBold"
android:textColor="#9b9b9b"
android:textColorLink="#7e1664" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:id="#+id/viewEvents"
android:background="#7e1664" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:gravity="center"
android:id="#+id/txtMeetings"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="#string/strMeetings"
android:layout_weight="1"
local:MvxBind="Click GoFetchAllMeetings"
android:layout_marginRight="1dp"
android:textSize="#dimen/textsize_medium"
android:tag="RobotoCondensedBold"
android:textColor="#9b9b9b"
android:textColorLink="#7e1664" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:id="#+id/viewMeetings"
android:background="#7e1664" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.2"
android:id="#+id/txtDate"
android:layout_gravity="center"
android:gravity="right">
<TextView
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="#string/strToday"
android:layout_marginRight="1dp"
android:textSize="#dimen/textsize_medium"
android:tag="RobotoCondensedBold"
android:textColor="#4a90e2"
android:textColorLink="#7e1664" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="0dp"
android:id="#+id/frameLayout1"
android:layout_weight="1.8"
android:minHeight="80dp">
<TextView xmlns:tools="http://schemas.android.com/tools"
android:text="#string/NoMeetingsforthisMonth"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/tv_no_evnt"
android:gravity="center"
android:visibility="gone"
tools:visibility="gone" />
<Mvx.MvxListView xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/mvl"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:smoothScrollbar="true"
android:scrollingCache="false"
android:animationCache="false"
local:MvxBind="ItemsSource _MeetingList; ItemClick ShowMeetingDetail,Mode=TwoWay"
android:layout_marginLeft="#dimen/border_5dp"
android:layout_marginRight="#dimen/border_5dp"
tools:visibility="gone"
android:listSelector="#drawable/list_selector"
android:drawSelectorOnTop="true" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I tried android:listSelector="#drawable/list_selector" and android:drawSelectorOnTop="true" but the effect is not showing up-. There os nothing else applied on the listview.
Here is the list_selector:
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#color/lg_pressed_state">
<item android:drawable="#color/purple_bw"/>
</ripple>
Thanks in advance.
I endend up achieving this wrapping the item layout inside a LinearLayout and added the ripple to it.
Please try and let me know:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/ripple_effect"
android:orientation="vertical">
<RelativeLayout xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/rltContent"
android:background="#color/youBackground"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Your content here -->
</RelativeLayout>
</LinearLayout>
Ripple example:
<ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="#color/colorPrimaryDark">
<item android:drawable="#color/colorPrimary" />
</ripple>
I always had success when setting android:background="?selectableItemBackground" to the list item and adding a onClick listener (without the listener, there was no ripple when clicking on the item).
Maybe it also works by setting this background to the whole list or in a style; otherwise, you'll have to make a separate layout file for the list item.

Using the BoxInsetLayout class

Looking at the docs (https://developer.android.com/training/wearables/ui/layouts.html), I am trying to defined a layout that would be displayed correctly on a square and round device using the BoxInsetLayout class.
But after following the docs, that's what appears on my screen :
The box goes out of the circle, and my buttons aren't displayed correctly.
<android.support.wearable.view.BoxInsetLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:padding="15dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/layout">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_volumeup"
android:id="#+id/buttonDown"
android:minHeight="0dp"
android:minWidth="0dp"
android:gravity="center_vertical|center_horizontal"
android:layout_gravity="right|top"
android:layout_alignTop="#+id/button_delete"
android:layout_toEndOf="#+id/buttonPlay" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_volumeup"
android:id="#+id/buttonUp"
android:gravity="center_vertical|center_horizontal"
android:layout_gravity="center_horizontal|top"
android:layout_alignTop="#+id/button_delete"
android:layout_toStartOf="#+id/button_delete" />
<TextView android:layout_width="match_parent"
android:layout_height="wrap_content" android:id="#+id/showName"
android:layout_gravity="center"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:layout_marginBottom="28dp">
</TextView>
<SeekBar
android:id="#+id/seekBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="10"
android:layout_gravity="left|center_vertical"
android:layout_above="#+id/buttonPlay"
android:layout_alignParentStart="true" />
<ImageButton android:id="#+id/buttonPlay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/button_play"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="54dp">
</ImageButton>
<Button
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="X"
android:id="#+id/button_delete"
android:layout_alignParentTop="true"
android:layout_toStartOf="#+id/buttonDown" />
</RelativeLayout>
</android.support.wearable.view.BoxInsetLayout>
I will answer to my own stupid question : you just have to change the padding (15dp isn't enough, I fixed it putting it to 50dp) :
android:padding="50dp"

android toolbar is hidden when Tabs are implemented

I've created an app interface material design toolbar,drawer,fab everything works. Then I wanted to add 2 tabs ,so I used https://github.com/neokree/MaterialTabs library.Now the fragments and swipe action works .But the toolbar is now disappeared and tabHost is in place of it. In Android studio design view(not avd) it shows but when it came to real device(kitkat) it is not. I don't know what's wrong I've implemented the same way as in the test in lib module.
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:fab="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".MyActivity">
<!-- The main content view -->
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
layout="#layout/toolbar"
android:id="#+id/toolbar" />
<it.neokree.materialtabs.MaterialTabHost
android:id="#+id/tabHost"
android:layout_width="match_parent"
android:layout_height="48dp"
app:primaryColor="#009688"
app:accentColor="#2B4AE0"
android:layout_below="#+id/toolbar" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/tabHost" />
<com.getbase.floatingactionbutton.FloatingActionsMenu
android:id="#+id/multiple_actions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
fab:fab_addButtonColorNormal="#color/primary"
fab:fab_addButtonColorPressed="#color/primary_pressed"
fab:fab_addButtonPlusIconColor="#color/white"
fab:fab_labelStyle="#style/menu_labels_style"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp"
android:layout_marginEnd="16dp">
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="#+id/action_a"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="#color/white"
fab:fab_title="Event"
fab:fab_icon="#drawable/ic_attendance"
fab:fab_colorPressed="#color/white_pressed" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="#+id/action_b"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="#color/white"
fab:fab_title="Message"
fab:fab_icon="#drawable/ic_message"
fab:fab_colorPressed="#color/white_pressed" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="#+id/action_c"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="#color/white"
fab:fab_title="Attendance"
fab:fab_icon="#drawable/ic_events"
fab:fab_colorPressed="#color/white_pressed" />
</com.getbase.floatingactionbutton.FloatingActionsMenu>
</RelativeLayout>
</FrameLayout>
<!-- The navigation drawer -->
<ListView
android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:layout_marginTop="?attr/actionBarSize"
android:background="#F8F8F8"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:fitsSystemWindows="false" />
</android.support.v4.widget.DrawerLayout>
This is the complete code I used, here I implemented tabs,toolbar and fab lib.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fab="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"
tools:context=".MyActivity">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<!-- The main content view -->
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<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="#dimen/abc_action_bar_default_height_material"
android:background="#2B4AE0"
app:theme="#style/ToolBarStyle">
<TextView
android:id="#+id/headerText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="#android:style/TextAppearance.Theme"
android:textColor="#android:color/white" />
<RelativeLayout
android:id="#+id/notification"
android:layout_width="50dp"
android:layout_height="match_parent"
android:layout_gravity="end"
android:background="#drawable/butto_pressed"
android:clickable="true"
>
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/bell_icon" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
<RelativeLayout
android:id="#+id/frame"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar">
<it.neokree.materialtabs.MaterialTabHost
android:id="#+id/tabHost"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
app:accentColor="#color/blue"
app:primaryColor="#color/white"
app:textColor="#color/blue" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/tabHost" />
<com.getbase.floatingactionbutton.FloatingActionsMenu
android:id="#+id/multiple_actions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
fab:fab_addButtonColorNormal="#color/primary"
fab:fab_addButtonColorPressed="#color/primary_pressed"
fab:fab_addButtonPlusIconColor="#color/white"
fab:fab_labelStyle="#style/menu_labels_style">
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="#+id/action_a"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="#color/white"
fab:fab_colorPressed="#color/white_pressed"
fab:fab_icon="#drawable/ic_attendance"
fab:fab_title="Announcement" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="#+id/action_b"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="#color/white"
fab:fab_colorPressed="#color/white_pressed"
fab:fab_icon="#drawable/ic_message"
fab:fab_title="Message" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="#+id/action_c"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="#color/white"
fab:fab_colorPressed="#color/white_pressed"
fab:fab_icon="#drawable/ic_events"
fab:fab_title="Attendance" />
</com.getbase.floatingactionbutton.FloatingActionsMenu>
</RelativeLayout>
</RelativeLayout>
</FrameLayout>
<!-- The navigation drawer -->
<ListView
android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:layout_marginTop="?attr/actionBarSize"
android:background="#F8F8F8"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:fitsSystemWindows="false" />
</android.support.v4.widget.DrawerLayout>
</LinearLayout>

Resources