Android Wear Round Emulator inflating Square Layout

Question

I first want to say that I know there are already questions like this one on here, but none of them fixed this issue

I am using the Round Android Wear Emulator (Android 5.0.1 and x86) on Ubuntu. The screen appears round, and all other features on the emulator (set watch face, cards) appear as they would on a round watch. However in my app, I am using a WatchViewStub, and the round emulator is inflating the square layout despite me specifying the following in the layout:

app:rectLayout="@layout/rect_activity_setup"
app:roundLayout="@layout/round_activity_setup"

Here is my Activity code:

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

    final WatchViewStub stub = (WatchViewStub) findViewById(R.id.watch_view_stub);
    stub.setOnApplyWindowInsetsListener(new View.OnApplyWindowInsetsListener() {
      @Override
      public WindowInsets onApplyWindowInsets(View view, WindowInsets windowInsets) {
        stub.onApplyWindowInsets(windowInsets);
        return windowInsets;
      }
    });
    stub.setOnLayoutInflatedListener(new WatchViewStub.OnLayoutInflatedListener() {
      @Override
      public void onLayoutInflated(WatchViewStub stub) {
        // ...
      }
    });
  }

Is there anything else I need to do to tell the app that the device is round? Or is this a bug with the emulator?

Answer 1

So you do it by setting a custom view. Let's say you want to inflate a FrameLayout . You would have two views. RoundFrameLayout.java and RectFrameLayout.java. Then have them both implement the following

public interface RoundAware {
    boolean isRound();
}

The RoundFrameLayout will look like this.

public class RoundFrameLayout extends FrameLayout implements RoundAware {
    public RoundFrameLayout(Context context) {
        super(context);
    }

    public RoundFrameLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public RoundFrameLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    public RoundFrameLayout(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
    }

    @Override
    public boolean isRound() {
        return true;
    }
}

The RectFrameLayout will look like this.

public class RectFrameLayout extends FrameLayout implements RoundAware {
    public RoundFrameLayout(Context context) {
        super(context);
    }

    public RoundFrameLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public RoundFrameLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    public RoundFrameLayout(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
    }

    @Override
    public boolean isRound() {
        return false;
    }
}

Then point your round and rect layouts for the view stub correctly at the RoundFrameLayout and RectFrameLayout xml file. If you want them to have the same stuff in them use the includes tag in each file for all of the view's children.