Using the BoxInsetLayout class - wear-os

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"

Related

How do i make the buttons from the following code be all the same size and occupy the entire gridLayout?

I have this grid layout which is part of an another grid layout, and contains 6 buttons.
It is next to a relative grid layout, if that makes any difference, thats why its width and height are set at 0dp.
How do I make them all the same size and make them fill the grid without using fixed values?
<android.support.v7.widget.GridLayout
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0.5"
app:layout_columnWeight="1"
app:layout_rowWeight="1"
app:columnCount="2"
app:rowCount="3"
>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="20dp"
android:text="#string/pocetna_dugme_prijava_problema"
style="#style/StartMenuButton"
android:background="#drawable/rounded_corners_button_start_menu"
android:id="#+id/btnPrijavaProblemaLink"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/pocetna_dugme_prijava_ebill"
style="#style/StartMenuButton"
android:background="#drawable/rounded_corners_button_start_menu"
android:id="#+id/btnPrijavaEracunLink"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/pocetna_dugme_prijava_ukljucenje"
style="#style/StartMenuButton"
android:background="#drawable/rounded_corners_button_start_menu"
android:id="#+id/btnUkljucenjeLink"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/pocetna_dugme_prepaid_dopuna"
android:padding="0dp"
android:drawableBottom="#drawable/prepaid10"
style="#style/StartMenuButton"
android:background="#drawable/rounded_corners_button_start_menu"
android:id="#+id/btnPrepaidDopunaLink"/>
If you want the control to divide the screen space horizontally and vertically,you can use LinearLayout to achieve this, and set the android:layout_weight="1" property for the controls.
And to make the UI look better, you can also set android:layout_margin property.
You can refer to the following code:
<?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"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
>
<Button
android:layout_margin="5dp"
android:layout_weight="1"
android:text="button1"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<Button
android:layout_margin="5dp"
android:layout_weight="1"
android:text="button2"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<Button
android:layout_margin="5dp"
android:layout_weight="1"
android:text="button3"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<Button
android:layout_margin="5dp"
android:layout_weight="1"
android:text="button4"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
</LinearLayout>
You should change all your nested LinearLayouts to use ConstraintLayouts. Nested LinearLayouts inflate slowly, which was why ConstraintLayouts were created to replace them about 4-5 years ago. Android.Support.V7.Widgets were also dropped in favour of AndroidX controls at about the same time.

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.

CoordinatorLayout scroll Tablayout itself

I want to have an activity, which contains a TabLayout and a Viewpager and some stuff below the Viewpager, which is visible in every Tab, and also scrollable.
When the recyclerview "tracks_recyclerview" is scrolled up, the TabLayout and the Edittext and the Viewpager hide as they should and the "all_tracks"-relativelayout and the horizontal Recyclerview stay at the top.
Here is what i want:
The content above the recyclerview should also be scrollable itself. So for now it is only possible to scroll down the "tracks_recyclerview". but the other parts of the view should also scroll down the list.
My Code looks something like this:
<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/content_activity"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/transparent">
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways"
app:tabContentStart="2dp"
app:tabGravity="fill"
app:tabIndicatorHeight="2dp"
app:tabMinWidth="24dp"
app:tabMode="fixed"
app:tabPadding="1dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways">
<EditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="?attr/listPreferredItemHeight"
android:layout_margin="10dp"
app:layout_scrollFlags="scroll|enterAlways" />
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#444"
app:layout_scrollFlags="scroll|enterAlways"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:id="#+id/all_tracks"
android:layout_width="140dp"
android:layout_height="155dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginBottom="10dp">
<ImageView
android:id="#+id/cover"
android:layout_width="140dp"
android:layout_height="120dp"
android:paddingBottom="20dp"
android:paddingTop="20dp"
android:scaleType="fitCenter"
android:src="#drawable/abc_btn_rating_star_on_mtrl_alpha" />
<TextView
android:id="#+id/name"
android:layout_width="140dp"
android:layout_height="35dp"
android:layout_below="#+id/cover"
android:gravity="center"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:textSize="12sp" />
</RelativeLayout>
<?-- horizontal Recyclerview -->
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="155dp"
android:layout_marginBottom="10dp"
android:layout_toRightOf="#+id/all_tracks" />
</RelativeLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/tracks_recyclerview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
I Hope you could understand my problem and maybe help me out.
Thanks,
Thomas
Edit: Is there somebody who can help me?

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>

Relative Layout Does Not Align 3 Images Correctly

I have a RelativeLayout which i'd like to use to create two side by side ImageViews (h1 and h2) with another image centered on top (ui3)
For some reason the images do not seem to align correctly when using the following:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".Home" >
<EditText
android:id="#+id/et_user"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="78dp"
android:layout_marginTop="195dp"
android:ems="10" >
<requestFocus />
</EditText>
<EditText
android:id="#+id/et_pw"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/editText1"
android:layout_below="#+id/editText1"
android:layout_marginLeft="45dp"
android:ems="10"
android:inputType="textPassword" />
<Button
android:id="#+id/btn_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/editText1"
android:layout_alignTop="#+id/editText2"
android:layout_marginLeft="21dp"
android:layout_marginTop="17dp"
android:text="Button" />
<Button
android:id="#+id/btn_reg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/button1"
android:layout_below="#+id/button1"
android:text="Button" />
<ImageView
android:id="#+id/ui3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
android:adjustViewBounds="true"
android:src="#drawable/ui2" />
<ImageView
android:id="#+id/h2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="1.0"
android:layout_alignRight="#+id/header1"
android:src="#drawable/h2" />
<ImageView
android:id="#+id/h1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignLeft="#+id/h2"
android:layout_alignParentLeft="true"
android:layout_weight="1.0"
android:layout_alignParentTop="true"
android:src="#drawable/h1" />
</RelativeLayout>
Expected Result:
Result:
To be perfectly clear: I simply need to create what appears to be one solid image out of the 3 individual images:
RESOURCES:
http://i.stack.imgur.com/pYZIt.jpg
http://i.stack.imgur.com/KzaYd.png
http://i.stack.imgur.com/hB9KS.png
Problem in your code - Circular reference between the views in layout.
Problem 1
This imageview is taking the complete screen size.
<ImageView
android:id="#+id/ui3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
android:adjustViewBounds="true"
/>
Problem 2
This image view is creating circular reference.
<ImageView
android:id="#+id/h1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignLeft="#+id/h2"
android:layout_alignParentLeft="true"
android:layout_weight="1.0"
android:layout_alignParentTop="true"
/>

Resources