Align element in corner of round Wear device

android, android-layout, wear-os

Solution

According for things shown on Google IO 2014 you should use `BoxInsetLayout`: Check out this video <- about 6:04

You can see the usage of `BoxInsetLayout` in `DelayedConfirmation` sample code. Here is a content of main_activity.xml file:

<?xml version="1.0" encoding="utf-8"?>
<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">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:background="@color/grey"
        app:layout_box="top">

        [...]

    </LinearLayout>
</android.support.wearable.view.BoxInsetLayout>

You can set the app:layout_box to following values: `left|top|right|bottom` or `all`. You can use `all` in your case, then all content will be kept within the box on every side. The effect for this layout is ignored when app is running on square watch.

EDIT:

I've just tested the code you've posted as "doesn't work":

<?xml version="1.0" encoding="utf-8"?>
<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">

   <TextView android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="1234567890"
       app:layout_box="all"/>

</android.support.wearable.view.BoxInsetLayout>

With activity:

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

I've told you to use the `all` value in `layout_box`, but even with `top` it works as should:

`app:layout_box="top"`: (only offset from top)

`app:layout_box="all"`: (offset from any side)

Problem

I am trying to align an Object into the corner of my round_layout for a round android wear device. As you can see here: The digitalclock will be out of bounds. I've seen the android wear documentation at the google IO 2014, and some guy showed, that there's a line of code, in order to align the objects correctly. I want the digitalclock to be in the top left corner, but not out of the screen. Has anyone got a suggestion? Here's the XML file: ``` <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MyActivity" tools:deviceIds="wear_round"> <DigitalClock android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="@color/text" android:textSize="20sp"/> </RelativeLayout> ``` Edit: My xml layout file looks like this right now, for the round activity: ``` <?xml version="1.0" encoding="utf-8"?> <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"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="1234567890" app:layout_box="top"/> </android.support.wearable.view.BoxInsetLayout> ``` As You can see, I tried to use the BoxInsetLayout, but still, the output is following: Although I used ``` app:layout_box="top" ``` The TextView is out of the screen's bounds. What have I overseen?

Original source