BoxInsetLayout not working

Question

In android studio v1.2.2, I created an Android Wear project. I removed WatchViewStub and used this example to create activity using BoxInsetLayout. But BoxInsetLayout does not work correctly on Round Device. And I tested it on moto 360 android 5.1.1 and before updating on moto 360 version 5.0.1. And I tested it on an emulator. And that doesn't work at all. All the time I see this:

but must be specified

My code is below:

activity_main.xml

<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"> <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent" android:padding="5dp" android:background="@color/red" app:layout_box="all"> <TextView android:gravity="center" android:layout_height="wrap_content" android:layout_width="match_parent" android:text="Hello Android Wear" android:textColor="@color/black" /> <ImageButton android:background="@drawable/selector_btn_ok" android:layout_gravity="bottom|start" android:layout_height="50dp" android:layout_width="50dp" /> <ImageButton android:background="@drawable/selector_btn_cancel" android:layout_gravity="bottom|end" android:layout_height="50dp" android:layout_width="50dp" /> </FrameLayout> </android.support.wearable.view.BoxInsetLayout> 

Why is this not working? Where am I wrong? And how can I use BoxInsetLayout correctly on round screen devices?

Answer 1

There is an error in your activity_main.xml file where you specified:

 android:padding="15dp" 

If you remove this, then it should work. BoxInsetLayout uses the add-on in the implementation, and you change the value that gives the incorrect result you are observing.

(edit) It is important to note that BoxInsetLayout adjusts the indentation both by itself and by children's representations. Therefore, make sure that you do not change the gasket value or that something breaks. You can try to implement the second FrameLayout if you want to have more control over the add-on.

Answer 2

I removed android:padding="15dp " from BoxInsetLayout as Wayne Piekarski . Now BoxInsetLayout is working correctly, but I have a new problem: android:padding="5dp" in FrameLayout does not work. I experimented with activity_layout, and I added id and changed the add- on to 20dp , and I got this result for the Round and Square screen:

My xml code for this

 <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_width="match_parent" android:layout_height="match_parent"> <FrameLayout android:id="@+id/first_frame_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/red" android:padding="20dp" app:layout_box="all"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="Hello Android Wear" android:textColor="@color/black" /> <ImageButton android:layout_width="50dp" android:layout_height="50dp" android:layout_gravity="bottom|start" android:background="@drawable/selector_btn_ok" /> <ImageButton android:layout_width="50dp" android:layout_height="50dp" android:layout_gravity="bottom|end" android:background="@drawable/selector_btn_cancel" /> </FrameLayout> </android.support.wearable.view.BoxInsetLayout> 

So, the addition in FrameLayout does not work with id first_frame_layout. But in the official documentation you can read about android:padding="5dp" in FrameLayout

This line assigns padding to the internal FrameLayout element. This gasket applies to both square and round screens. The total filling between the buttons and window inserts is 20 dp on square screens (15 + 5) and 5 dp on round screens.

To quickly fix this problem: I added a new FrameLayout with id second_frame_layout as a child in FrameLayout with id first_frame_layout. I removed padding from first_frame_layout and added padding="5dp" to second_frame_layout. I got this result:

final activity_main.xml

 <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_width="match_parent" android:layout_height="match_parent"> <FrameLayout android:id="@+id/first_frame_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/red" app:layout_box="all"> <FrameLayout android:id="@+id/second_frame_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/green" android:padding="5dp"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="Hello Android Wear" android:textColor="@color/black" /> <ImageButton android:layout_width="50dp" android:layout_height="50dp" android:layout_gravity="bottom|start" android:background="@drawable/selector_btn_ok" /> <ImageButton android:layout_width="50dp" android:layout_height="50dp" android:layout_gravity="bottom|end" android:background="@drawable/selector_btn_cancel" /> </FrameLayout> </FrameLayout> </android.support.wearable.view.BoxInsetLayout> 

Now. It works the way I want on the Square and Round screens.