Refactors watch face config activity to match ustwo's design and
includes click on watchface in settings to change complications.
Also, lots of pngs so CL isn't as big as it seems.
Ability to edit appearance and other items (outside of complications)
will follow in other CLs.
Bug: 32214858
Change-Id: Ia39d965513aa53ef20771b1846fcbcfa58960ebc
diff --git a/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/config/ComplicationSimpleConfigActivity.java b/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/config/ComplicationSimpleConfigActivity.java
index c63333f..f60f1f5 100644
--- a/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/config/ComplicationSimpleConfigActivity.java
+++ b/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/config/ComplicationSimpleConfigActivity.java
@@ -16,58 +16,58 @@
package com.example.android.wearable.watchface.config;
import android.app.Activity;
-import android.content.ComponentName;
-import android.content.Context;
import android.content.Intent;
-import android.content.res.TypedArray;
-import android.graphics.drawable.Drawable;
import android.os.Bundle;
-import android.support.wearable.complications.ComplicationHelperActivity;
import android.support.wearable.complications.ComplicationProviderInfo;
import android.support.wearable.complications.ProviderChooserIntent;
-import android.support.wearable.view.WearableListView;
+import android.support.wearable.view.WearableRecyclerView;
import android.util.Log;
-import android.view.LayoutInflater;
-import android.view.View;
-import android.view.ViewGroup;
-import android.widget.ImageView;
-import android.widget.TextView;
-import com.example.android.wearable.watchface.watchfaces.ComplicationSimpleWatchFaceService;
import com.example.android.wearable.watchface.R;
-
-import java.util.ArrayList;
-import java.util.List;
+import com.example.android.wearable.watchface.models.ComplicationsSimpleWatchFaceSettingsConfigData;
+import com.example.android.wearable.watchface.watchfaces.ComplicationSimpleWatchFaceService;
/**
* The watch-side config activity for {@link ComplicationSimpleWatchFaceService}, which
- * allows for setting complications on the left and right of watch face.
+ * allows for setting the left and right complications of watch face along with the marker (watch
+ * face arms, ticks) color, unread notifications toggle, and background complication.
*/
-public class ComplicationSimpleConfigActivity extends Activity implements
- WearableListView.ClickListener {
+public class ComplicationSimpleConfigActivity extends Activity {
- private static final String TAG = "CompSimpleConfig";
+ private static final String TAG = ComplicationSimpleConfigActivity.class.getSimpleName();
- private static final int PROVIDER_CHOOSER_REQUEST_CODE = 1;
+ static final int COMPLICATION_CONFIG_REQUEST_CODE = 888;
- private WearableListView mWearableConfigListView;
- private ConfigurationAdapter mAdapter;
+ private WearableRecyclerView mConfigWearableRecyclerView;
+
+ private ComplicationSimpleRecyclerViewAdapter mWearableRecyclerViewAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
+
setContentView(R.layout.activity_complication_simple_config);
- mAdapter = new ConfigurationAdapter(getApplicationContext(), getComplicationItems());
+ mWearableRecyclerViewAdapter =
+ new ComplicationSimpleRecyclerViewAdapter(
+ ComplicationsSimpleWatchFaceSettingsConfigData.getSettingsData());
- mWearableConfigListView = (WearableListView) findViewById(R.id.wearable_list);
- mWearableConfigListView.setAdapter(mAdapter);
- mWearableConfigListView.setClickListener(this);
+ mConfigWearableRecyclerView =
+ (WearableRecyclerView) findViewById(R.id.wearable_recycler_view);
+
+ // Aligns the first and last items on the list vertically centered on the screen.
+ mConfigWearableRecyclerView.setCenterEdgeItems(true);
+
+ // Improves performance because we know changes in content do not change the layout size of
+ // the RecyclerView.
+ mConfigWearableRecyclerView.setHasFixedSize(true);
+
+ mConfigWearableRecyclerView.setAdapter(mWearableRecyclerViewAdapter);
}
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
- if (requestCode == PROVIDER_CHOOSER_REQUEST_CODE
+ if (requestCode == COMPLICATION_CONFIG_REQUEST_CODE
&& resultCode == RESULT_OK) {
// Retrieves information for selected Complication provider.
@@ -75,134 +75,6 @@
data.getParcelableExtra(ProviderChooserIntent.EXTRA_PROVIDER_INFO);
Log.d(TAG, "Selected Provider: " + complicationProviderInfo);
-
- finish();
- }
- }
-
- @Override
- public void onClick(WearableListView.ViewHolder viewHolder) {
- if (Log.isLoggable(TAG, Log.DEBUG)) {
- Log.d(TAG, "onClick()");
- }
-
- Integer tag = (Integer) viewHolder.itemView.getTag();
- ComplicationItem complicationItem = mAdapter.getItem(tag);
-
- // Note: If you were previously using ProviderChooserIntent.createProviderChooserIntent()
- // (now deprecated), you will want to switch to
- // ComplicationHelperActivity.createProviderChooserHelperIntent()
- startActivityForResult(
- ComplicationHelperActivity.createProviderChooserHelperIntent(
- getApplicationContext(),
- complicationItem.watchFace,
- complicationItem.complicationId,
- complicationItem.supportedTypes),
- PROVIDER_CHOOSER_REQUEST_CODE);
- }
-
- private List<ComplicationItem> getComplicationItems() {
- ComponentName watchFace = new ComponentName(
- getApplicationContext(), ComplicationSimpleWatchFaceService.class);
-
- String[] complicationNames =
- getResources().getStringArray(R.array.complication_simple_names);
-
- int[] complicationIds = ComplicationSimpleWatchFaceService.COMPLICATION_IDS;
-
- TypedArray icons = getResources().obtainTypedArray(R.array.complication_simple_icons);
-
- List<ComplicationItem> items = new ArrayList<>();
- for (int i = 0; i < complicationIds.length; i++) {
- items.add(new ComplicationItem(watchFace,
- complicationIds[i],
- ComplicationSimpleWatchFaceService.COMPLICATION_SUPPORTED_TYPES[i],
- icons.getDrawable(i),
- complicationNames[i]));
- }
- return items;
- }
-
- @Override
- public void onTopEmptyRegionClick() {
- if (Log.isLoggable(TAG, Log.DEBUG)) {
- Log.d(TAG, "onTopEmptyRegionClick()");
- }
- }
-
- /*
- * Inner class representing items of the ConfigurationAdapter (WearableListView.Adapter) class.
- */
- private final class ComplicationItem {
- ComponentName watchFace;
- int complicationId;
- int[] supportedTypes;
- Drawable icon;
- String title;
-
- public ComplicationItem(ComponentName watchFace, int complicationId, int[] supportedTypes,
- Drawable icon, String title) {
- this.watchFace = watchFace;
- this.complicationId = complicationId;
- this.supportedTypes = supportedTypes;
- this.icon = icon;
- this.title = title;
- }
- }
-
- private static class ConfigurationAdapter extends WearableListView.Adapter {
-
- private Context mContext;
- private final LayoutInflater mInflater;
- private List<ComplicationItem> mItems;
-
-
- public ConfigurationAdapter (Context context, List<ComplicationItem> items) {
- mContext = context;
- mInflater = LayoutInflater.from(mContext);
- mItems = items;
- }
-
- // Provides a reference to the type of views you're using
- public static class ItemViewHolder extends WearableListView.ViewHolder {
- private ImageView iconImageView;
- private TextView textView;
- public ItemViewHolder(View itemView) {
- super(itemView);
- iconImageView = (ImageView) itemView.findViewById(R.id.icon);
- textView = (TextView) itemView.findViewById(R.id.name);
- }
- }
-
- @Override
- public WearableListView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
-
- // Inflate custom layout for list items.
- return new ItemViewHolder(
- mInflater.inflate(R.layout.activity_complication_simple_list_item, null));
- }
-
- @Override
- public void onBindViewHolder(WearableListView.ViewHolder holder, int position) {
-
- ItemViewHolder itemHolder = (ItemViewHolder) holder;
-
- ImageView imageView = itemHolder.iconImageView;
- imageView.setImageDrawable(mItems.get(position).icon);
-
- TextView textView = itemHolder.textView;
- textView.setText(mItems.get(position).title);
-
- holder.itemView.setTag(position);
- }
-
- @Override
- public int getItemCount() {
- return mItems.size();
- }
-
- public ComplicationItem getItem(int position) {
- return mItems.get(position);
}
}
}
\ No newline at end of file
diff --git a/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/config/ComplicationSimpleRecyclerViewAdapter.java b/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/config/ComplicationSimpleRecyclerViewAdapter.java
new file mode 100644
index 0000000..70abcd0
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/config/ComplicationSimpleRecyclerViewAdapter.java
@@ -0,0 +1,377 @@
+/*
+ * Copyright (C) 2017 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package com.example.android.wearable.watchface.config;
+
+import android.app.Activity;
+import android.content.ComponentName;
+import android.content.Context;
+import android.graphics.Rect;
+import android.support.v7.widget.RecyclerView;
+import android.support.wearable.complications.ComplicationHelperActivity;
+import android.util.Log;
+import android.view.LayoutInflater;
+import android.view.MotionEvent;
+import android.view.View;
+import android.view.ViewGroup;
+import android.view.ViewTreeObserver;
+import android.widget.Button;
+import android.widget.ImageView;
+
+import com.example.android.wearable.watchface.R;
+import com.example.android.wearable.watchface.models.ComplicationsSimpleWatchFaceSettingsConfigData.AppearanceConfigItem;
+import com.example.android.wearable.watchface.models.ComplicationsSimpleWatchFaceSettingsConfigData.ComplicationsConfigItem;
+import com.example.android.wearable.watchface.models.ComplicationsSimpleWatchFaceSettingsConfigData.MoreOptionsConfigItem;
+
+import com.example.android.wearable.watchface.watchfaces.ComplicationSimpleWatchFaceService;
+
+import java.util.ArrayList;
+
+/**
+ * Displays different layouts for configuring watch face's complications and appearance settings.
+ * Class extends {@RecyclerView.Adapter} and updates {@ComplicationSimpleWatchFaceService}.
+ * <p>
+ * Layouts provided by this adapter are split into 2 main view types.
+ * <p>
+ * A layout representing the watch face along with complication locations. This allows the user
+ * to tap on the area of the watch face where they want to change the complication data.
+ * <p>
+ * A layout representing other appearance configuration outside of the main complications on the
+ * watch face. These could include marker color, background color, layout, unread notifications,
+ * and many others. This sample is simplified, so it only includes marker color,
+ * unread notifications, and background complication.
+ */
+public class ComplicationSimpleRecyclerViewAdapter extends
+ RecyclerView.Adapter<RecyclerView.ViewHolder> {
+
+ private static final String TAG = "CompConfigAdapter";
+
+ private static final int TYPE_COMPLICATIONS_CONFIG = 0;
+ private static final int TYPE_MORE_OPTIONS_CONFIG = 1;
+ private static final int TYPE_APPEARANCE_CONFIG = 2;
+
+ private ArrayList<Object> mSettingsDataSet;
+
+ public ComplicationSimpleRecyclerViewAdapter(ArrayList<Object> settingsDataSet) {
+ mSettingsDataSet = settingsDataSet;
+ }
+
+ @Override
+ public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
+ Log.d(TAG, "onCreateViewHolder(): viewType: " + viewType);
+
+ RecyclerView.ViewHolder viewHolder = null;
+
+ switch (viewType) {
+ case TYPE_COMPLICATIONS_CONFIG:
+ viewHolder = new ComplicationsViewHolder(LayoutInflater.from(parent.getContext())
+ .inflate(R.layout.config_list_complication_item, parent, false));
+ break;
+
+ case TYPE_MORE_OPTIONS_CONFIG:
+ viewHolder = new MoreOptionsViewHolder(LayoutInflater.from(parent.getContext())
+ .inflate(R.layout.config_list_more_options_item, parent, false));
+ break;
+
+ case TYPE_APPEARANCE_CONFIG:
+ viewHolder = new AppearanceViewHolder(LayoutInflater.from(parent.getContext())
+ .inflate(R.layout.config_list_appearance_item, parent, false));
+ break;
+ }
+
+ return viewHolder;
+ }
+
+ @Override
+ public void onBindViewHolder(RecyclerView.ViewHolder viewHolder, int position) {
+ Log.d(TAG, "Element " + position + " set.");
+
+ // Pulls all data for settings options.
+ Object configItem = mSettingsDataSet.get(position);
+
+ switch (viewHolder.getItemViewType()) {
+
+ case TYPE_COMPLICATIONS_CONFIG:
+ ComplicationsViewHolder complicationsViewHolder =
+ (ComplicationsViewHolder) viewHolder;
+
+ ComplicationsConfigItem complicationsConfigItem =
+ (ComplicationsConfigItem) configItem;
+
+ int watchFaceInt = complicationsConfigItem.getWatchFaceDrawable();
+
+ complicationsViewHolder.setWatchFacePreviewImageView(watchFaceInt);
+ break;
+
+ case TYPE_MORE_OPTIONS_CONFIG:
+ MoreOptionsViewHolder moreOptionsViewHolder = (MoreOptionsViewHolder) viewHolder;
+
+ MoreOptionsConfigItem moreOptionsConfigItem = (MoreOptionsConfigItem) configItem;
+
+ moreOptionsViewHolder.setIcon(moreOptionsConfigItem.getDrawable());
+ break;
+
+
+ case TYPE_APPEARANCE_CONFIG:
+ AppearanceViewHolder appearanceViewHolder = (AppearanceViewHolder) viewHolder;
+
+ AppearanceConfigItem appearanceConfigItem = (AppearanceConfigItem) configItem;
+
+ int iconInt = appearanceConfigItem.getIcon();
+ String name = appearanceConfigItem.getName();
+
+ appearanceViewHolder.setName(name);
+ appearanceViewHolder.setIcon(iconInt);
+ break;
+ }
+ }
+
+
+
+ @Override
+ public int getItemViewType(int position) {
+
+ if (mSettingsDataSet.get(position)
+ instanceof ComplicationsConfigItem) {
+ return TYPE_COMPLICATIONS_CONFIG;
+
+ } else if (mSettingsDataSet.get(position)
+ instanceof MoreOptionsConfigItem) {
+ return TYPE_MORE_OPTIONS_CONFIG;
+
+ } else if (mSettingsDataSet.get(position)
+ instanceof AppearanceConfigItem) {
+ return TYPE_APPEARANCE_CONFIG;
+ }
+ return -1;
+ }
+
+ @Override
+ public int getItemCount() {
+ return mSettingsDataSet.size();
+ }
+
+ /**
+ * Layout displays watch face preview along with complication locations allowing the user to
+ * tap on the complication they want to change.
+ */
+ public class ComplicationsViewHolder extends RecyclerView.ViewHolder
+ implements View.OnTouchListener {
+
+ private static final int SMALL_OFFSET = 10;
+ private static final int LARGE_OFFSET = 100;
+ private static final int TAPPABLE_SPACE = 100;
+
+ private Rect mLeftComplicationRect;
+ private Rect mRightComplicationRect;
+ private Rect mTopComplicationRect;
+ private Rect mBottomComplicationRect;
+
+ private ImageView mWatchFacePreviewImageView;
+
+ public ComplicationsViewHolder(final View view) {
+ super(view);
+ mWatchFacePreviewImageView = (ImageView) view.findViewById(R.id.watch_face_preview);
+
+ view.setOnTouchListener(this);
+
+ // Used to get dimensions of view once it is inflated to calculate locations of
+ // complications.
+ view.getViewTreeObserver().addOnGlobalLayoutListener(
+ new ViewTreeObserver.OnGlobalLayoutListener() {
+ @Override public void onGlobalLayout() {
+ // Calculates tappable space for each complication location.
+ // Constructor: Rect(int left, int top, int right, int bottom).
+ mLeftComplicationRect =
+ new Rect(
+ SMALL_OFFSET,
+ LARGE_OFFSET,
+ SMALL_OFFSET + TAPPABLE_SPACE,
+ LARGE_OFFSET + TAPPABLE_SPACE);
+
+ mRightComplicationRect =
+ new Rect(
+ view.getWidth() - SMALL_OFFSET - TAPPABLE_SPACE,
+ LARGE_OFFSET,
+ view.getWidth() - SMALL_OFFSET,
+ LARGE_OFFSET + TAPPABLE_SPACE);
+
+ mTopComplicationRect =
+ new Rect(
+ LARGE_OFFSET,
+ SMALL_OFFSET,
+ LARGE_OFFSET + TAPPABLE_SPACE,
+ SMALL_OFFSET + TAPPABLE_SPACE);
+
+ mBottomComplicationRect =
+ new Rect(
+ LARGE_OFFSET,
+ view.getHeight() - SMALL_OFFSET - TAPPABLE_SPACE,
+ LARGE_OFFSET + TAPPABLE_SPACE,
+ view.getHeight() - SMALL_OFFSET);
+ }
+ });
+ }
+
+ @Override
+ public boolean onTouch(View view, MotionEvent event) {
+
+ if (event.getAction() == MotionEvent.ACTION_UP) {
+
+ int x = (int) event.getX();
+ int y = (int) event.getY();
+
+ if (mLeftComplicationRect.contains(x, y)) {
+ Log.d(TAG, "LEFT Complication: x, y: " + x + ", " + y);
+
+ Activity currentActivity = (Activity) view.getContext();
+ launchComplicationHelperActivity(
+ currentActivity,
+ ComplicationSimpleWatchFaceService.ComplicationLocation.LEFT);
+
+ } else if (mRightComplicationRect.contains(x, y)) {
+ Log.d(TAG, "RIGHT Complication: x, y: " + x + ", " + y);
+
+ Activity currentActivity = (Activity) view.getContext();
+ launchComplicationHelperActivity(
+ currentActivity,
+ ComplicationSimpleWatchFaceService.ComplicationLocation.RIGHT);
+
+ } else if (mTopComplicationRect.contains(x, y)) {
+ Log.d(TAG, "TOP Complication: x, y: " + x + ", " + y);
+
+ Activity currentActivity = (Activity) view.getContext();
+ launchComplicationHelperActivity(
+ currentActivity,
+ ComplicationSimpleWatchFaceService.ComplicationLocation.TOP);
+
+ } else if (mBottomComplicationRect.contains(x, y)) {
+ Log.d(TAG, "BOTTOM Complication: x, y: " + x + ", " + y);
+
+ Activity currentActivity = (Activity) view.getContext();
+ launchComplicationHelperActivity(
+ currentActivity,
+ ComplicationSimpleWatchFaceService.ComplicationLocation.BOTTOM);
+ }
+ }
+ return true;
+ }
+
+ // Verifies the watch face supports the complication location, then launches the helper
+ // class, so user can choose their complication data provider.
+ private void launchComplicationHelperActivity(
+ Activity currentActivity,
+ ComplicationSimpleWatchFaceService.ComplicationLocation complicationLocation) {
+
+ int complicationId =
+ ComplicationSimpleWatchFaceService.getComplicationId(complicationLocation);
+
+ if (complicationId >= 0) {
+
+ int[] supportedTypes = ComplicationSimpleWatchFaceService
+ .getSupportedComplicationTypes(complicationLocation);
+
+ if (supportedTypes.length > 0) {
+
+ ComponentName watchFace = new ComponentName(
+ currentActivity,
+ ComplicationSimpleWatchFaceService.class);
+
+ currentActivity.startActivityForResult(
+ ComplicationHelperActivity.createProviderChooserHelperIntent(
+ currentActivity,
+ watchFace,
+ complicationId,
+ supportedTypes),
+ ComplicationSimpleConfigActivity.COMPLICATION_CONFIG_REQUEST_CODE);
+ } else {
+ Log.d(TAG, "Complication has no supported types.");
+ }
+
+ } else {
+ Log.d(TAG, "Complication not supported by watch face.");
+ }
+ }
+
+ public void setWatchFacePreviewImageView(int resourceId) {
+ Context context = mWatchFacePreviewImageView.getContext();
+ mWatchFacePreviewImageView.setImageDrawable(context.getDrawable(resourceId));
+ }
+ }
+
+ /**
+ * Layout displays all other non-complication appearance configuration options for the
+ * watch face. These could include marker color, background color, layout, unread notifications,
+ * and many others.
+ */
+ public class MoreOptionsViewHolder extends RecyclerView.ViewHolder {
+
+ private ImageView mMoreOptionsImageView;
+
+ public MoreOptionsViewHolder(View view) {
+ super(view);
+ mMoreOptionsImageView = (ImageView) view.findViewById(R.id.more_options_image_view);
+ }
+
+ public void setIcon(int resourceId) {
+ Context context = mMoreOptionsImageView.getContext();
+ mMoreOptionsImageView.setImageDrawable(context.getDrawable(resourceId));
+ }
+ }
+
+ /**
+ * Layout displays all other non-complication appearance configuration options for the
+ * watch face. These could include marker color, background color, layout, unread notifications,
+ * and many others.
+ */
+ public class AppearanceViewHolder extends RecyclerView.ViewHolder
+ implements View.OnClickListener {
+
+ private Button mAppearanceButton;
+
+ public AppearanceViewHolder(View view) {
+ super(view);
+
+ mAppearanceButton = (Button) view.findViewById(R.id.appearance_button);
+ view.setOnClickListener(this);
+ }
+
+ public void setName(String name) {
+ mAppearanceButton.setText(name);
+ }
+
+ public void setIcon(int resourceId) {
+ Context context = mAppearanceButton.getContext();
+ mAppearanceButton.setCompoundDrawablesWithIntrinsicBounds(
+ context.getDrawable(resourceId),
+ null,
+ null,
+ null);
+ }
+
+
+ @Override
+ public void onClick(View v) {
+ int position = getAdapterPosition();
+ Log.d(TAG, "Complication onClick() position: " + position);
+
+ // TODO (jewalker): Launch Activity to select appearance.
+ }
+ }
+
+ // TODO(jewalker): Add custom RecyclerView.ViewHolder for unread Notification toggle.
+ // TODO(jewalker): Add custom RecyclerView.ViewHolder for background image complication.
+}
\ No newline at end of file
diff --git a/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/models/ComplicationsSimpleWatchFaceSettingsConfigData.java b/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/models/ComplicationsSimpleWatchFaceSettingsConfigData.java
new file mode 100644
index 0000000..454fd11
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/models/ComplicationsSimpleWatchFaceSettingsConfigData.java
@@ -0,0 +1,117 @@
+/*
+ * Copyright (C) 2017 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+package com.example.android.wearable.watchface.models;
+
+import com.example.android.wearable.watchface.R;
+
+import java.util.ArrayList;
+
+/**
+ * Data represents different views for configuring the
+ * {@link com.example.android.wearable.watchface.watchfaces.ComplicationSimpleWatchFaceService}
+ * watch face's appearance and complications.
+ */
+public class ComplicationsSimpleWatchFaceSettingsConfigData {
+
+ public static ArrayList<Object> getSettingsData() {
+
+ ArrayList<Object> settingsConfigData = new ArrayList<>();
+
+ // Data for complications UX in settings Activity (ComplicationSimpleConfigActivity).
+ Object complicationConfigItem =
+ new ComplicationsConfigItem(R.drawable.preview_settings_complication_240);
+ settingsConfigData.add(complicationConfigItem);
+
+ // Data for drawable indicating there are more options in the settings
+ // Activity (ComplicationSimpleConfigActivity).
+ Object moreOptionsConfigItem =
+ new MoreOptionsConfigItem(R.drawable.ic_expand_more_white_18dp);
+ settingsConfigData.add(moreOptionsConfigItem);
+
+ // Data for Markers (watch face arms/hands/ticks) UX in settings
+ // Activity (ComplicationSimpleConfigActivity).
+ Object markersConfigItem =
+ new AppearanceConfigItem("Markers", R.drawable.icn_styles);
+ settingsConfigData.add(markersConfigItem);
+
+ // Data for 'Unread Notifications' UX (toggle) in settings
+ // Activity (ComplicationSimpleConfigActivity).
+ Object unreadNotificationsConfigItem =
+ new AppearanceConfigItem(
+ "Unread Notifications",
+ R.drawable.ic_notifications_white_24dp);
+ settingsConfigData.add(unreadNotificationsConfigItem);
+
+ // Data for background complications UX in settings
+ // Activity (ComplicationSimpleConfigActivity).
+ Object backgroundImageComplicationConfigItem =
+ new AppearanceConfigItem("Background Image", R.drawable.ic_landscape_white);
+ settingsConfigData.add(backgroundImageComplicationConfigItem);
+
+ return settingsConfigData;
+ }
+
+ /**
+ * Represents Complication data for config settings in a RecyclerView.
+ */
+ public static class ComplicationsConfigItem {
+ private int watchFaceDrawable;
+
+ ComplicationsConfigItem(int drawable) {
+ watchFaceDrawable = drawable;
+ }
+
+ public int getWatchFaceDrawable() {
+ return watchFaceDrawable;
+ }
+ }
+
+ /**
+ * Represents simple "more options" icon for config settings in a RecyclerView.
+ */
+ public static class MoreOptionsConfigItem {
+ private int drawable;
+
+ MoreOptionsConfigItem(int drawable) {
+ this.drawable = drawable;
+ }
+
+ public int getDrawable() {
+ return drawable;
+ }
+ }
+
+ /**
+ * Represents Appearance type data for config settings in a RecyclerView.
+ */
+ public static class AppearanceConfigItem {
+ private String name;
+ private int icon;
+
+ AppearanceConfigItem(String name, int icon) {
+ this.name = name;
+ this.icon = icon;
+ }
+
+ public String getName() {
+ return name;
+ }
+
+ public int getIcon() {
+ return icon;
+ }
+ }
+}
\ No newline at end of file
diff --git a/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/watchfaces/ComplicationSimpleWatchFaceService.java b/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/watchfaces/ComplicationSimpleWatchFaceService.java
index f0a5309..ed00e4a 100644
--- a/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/watchfaces/ComplicationSimpleWatchFaceService.java
+++ b/wearable/wear/WatchFace/Wearable/src/main/java/com/example/android/wearable/watchface/watchfaces/ComplicationSimpleWatchFaceService.java
@@ -38,18 +38,16 @@
import android.support.wearable.complications.ComplicationData;
import android.support.wearable.complications.ComplicationHelperActivity;
import android.support.wearable.complications.ComplicationText;
-import android.support.wearable.complications.SystemProviders;
-import android.support.wearable.complications.rendering.TextRenderer;
import android.support.wearable.watchface.CanvasWatchFaceService;
import android.support.wearable.watchface.WatchFaceService;
import android.support.wearable.watchface.WatchFaceStyle;
-import android.text.TextPaint;
+import android.text.TextUtils;
import android.util.Log;
import android.util.SparseArray;
-import android.view.Gravity;
import android.view.SurfaceHolder;
import com.example.android.wearable.watchface.R;
+import com.example.android.wearable.watchface.config.ComplicationSimpleRecyclerViewAdapter;
import java.util.Calendar;
import java.util.TimeZone;
@@ -61,12 +59,21 @@
public class ComplicationSimpleWatchFaceService extends CanvasWatchFaceService {
private static final String TAG = "SimpleComplicationWF";
- // Unique IDs for each complication.
- private static final int LEFT_DIAL_COMPLICATION = 0;
- private static final int RIGHT_DIAL_COMPLICATION = 1;
+ /**
+ * Used by {@link ComplicationSimpleRecyclerViewAdapter} to request supported complication
+ * locations and types.
+ */
+ public enum ComplicationLocation {
+ LEFT, RIGHT, TOP, BOTTOM
+ }
+
+ // Unique IDs for each complication. The settings activity that supports allowing users
+ // to select their complication data provider requires numbers to be >= 0.
+ private static final int LEFT_COMPLICATION_ID = 0;
+ private static final int RIGHT_COMPLICATION_ID = 1;
// Left and right complication IDs as array for Complication API.
- public static final int[] COMPLICATION_IDS = {LEFT_DIAL_COMPLICATION, RIGHT_DIAL_COMPLICATION};
+ public static final int[] COMPLICATION_IDS = {LEFT_COMPLICATION_ID, RIGHT_COMPLICATION_ID};
// Left and right dial supported types.
public static final int[][] COMPLICATION_SUPPORTED_TYPES = {
@@ -74,6 +81,34 @@
{ComplicationData.TYPE_SHORT_TEXT}
};
+ // Used by {@link ComplicationSimpleRecyclerViewAdapter} to check if complication location
+ // is supported in settings config activity.
+ public static int getComplicationId(ComplicationLocation complicationLocation) {
+ // Add any other supported locations here.
+ switch (complicationLocation) {
+ case LEFT:
+ return LEFT_COMPLICATION_ID;
+ case RIGHT:
+ return RIGHT_COMPLICATION_ID;
+ default:
+ return -1;
+ }
+ }
+
+ // Used by {@link ComplicationSimpleRecyclerViewAdapter} to see which complication types are
+ // supported in the settings config activity.
+ public static int[] getSupportedComplicationTypes(ComplicationLocation complicationLocation) {
+ // Add any other supported locations here.
+ switch (complicationLocation) {
+ case LEFT:
+ return COMPLICATION_SUPPORTED_TYPES[0];
+ case RIGHT:
+ return COMPLICATION_SUPPORTED_TYPES[1];
+ default:
+ return new int[]{};
+ }
+ }
+
/*
* Update rate in milliseconds for interactive mode. We update once a second to advance the
* second hand.
@@ -88,8 +123,8 @@
private class Engine extends CanvasWatchFaceService.Engine {
private static final int MSG_UPDATE_TIME = 0;
- private static final float COMPLICATION_MAIN_TEXT_SIZE = 38f;
- private static final float COMPLICATION_SUB_TEXT_SIZE = 34f;
+ private static final float COMPLICATION_TEXT_SIZE = 38f;
+ private static final int COMPLICATION_TAP_BUFFER = 40;
private static final float HOUR_STROKE_WIDTH = 5f;
private static final float MINUTE_STROKE_WIDTH = 3f;
@@ -126,21 +161,15 @@
private Bitmap mBackgroundBitmap;
private Bitmap mGrayBackgroundBitmap;
- // Renders text for complications in specified bounds (shrinks text in some cases).
- private TextRenderer mLeftMainTextComplicationRenderer;
- private TextRenderer mLeftSubTextComplicationRenderer;
- private TextRenderer mRightMainTextComplicationRenderer;
- private TextRenderer mRightSubTextComplicationRenderer;
+ // Variables for painting Complications
+ private Paint mComplicationPaint;
- // Holds Paint style for all complications.
- private TextPaint mComplicationMainTextPaint;
- private TextPaint mComplicationSubTextPaint;
-
- // Bounds for the upper (main text) and lower (subtext) areas of the complications.
- private Rect mLeftComplicationMainTextBounds;
- private Rect mLeftComplicationSubTextBounds;
- private Rect mRightComplicationMainTextBounds;
- private Rect mRightComplicationSubTextBounds;
+ /* To properly place each complication, we need their x and y coordinates. While the width
+ * may change from moment to moment based on the time, the height will not change, so we
+ * store it as a local variable and only calculate it only when the surface changes
+ * (onSurfaceChanged()).
+ */
+ private int mComplicationsY;
/* Maps active complication ids to the data for that complication. Note: Data will only be
* present if the user has chosen a provider via the settings activity for the watch face.
@@ -151,6 +180,8 @@
private boolean mLowBitAmbient;
private boolean mBurnInProtection;
+ private Rect mPeekCardBounds = new Rect();
+
private final BroadcastReceiver mTimeZoneReceiver = new BroadcastReceiver() {
@Override
public void onReceive(Context context, Intent intent) {
@@ -187,35 +218,18 @@
mCalendar = Calendar.getInstance();
- initializeComplicationDefaults();
+ setWatchFaceStyle(new WatchFaceStyle.Builder(ComplicationSimpleWatchFaceService.this)
+ .setCardPeekMode(WatchFaceStyle.PEEK_MODE_SHORT)
+ .setAcceptsTapEvents(true)
+ .setBackgroundVisibility(WatchFaceStyle.BACKGROUND_VISIBILITY_INTERRUPTIVE)
+ .setShowSystemUiTime(false)
+ .build());
+
initializeBackground();
initializeComplication();
initializeWatchFace();
}
- /*
- * Sets a system provider as the default provider for the specified watch face
- * complication id.
- *
- * To set a non-system provider as a default, or to clear a default,
- * use setDefaultComplicationProvider(int, ComponentName, int).
- *
- * Important Note: Call these methods before initializing your watch face with
- * setWatchFaceStyle(). In this example, we call setWatchFaceStyle() in the
- * initializeWatchFace() method called after this method in onCreate().
- */
- private void initializeComplicationDefaults() {
- setDefaultSystemComplicationProvider(
- RIGHT_DIAL_COMPLICATION,
- SystemProviders.DATE,
- ComplicationData.TYPE_SHORT_TEXT);
-
- setDefaultSystemComplicationProvider(
- LEFT_DIAL_COMPLICATION,
- SystemProviders.WATCH_BATTERY,
- ComplicationData.TYPE_SHORT_TEXT);
- }
-
private void initializeBackground() {
mBackgroundPaint = new Paint();
mBackgroundPaint.setColor(Color.BLACK);
@@ -228,38 +242,11 @@
}
mActiveComplicationDataSparseArray = new SparseArray<>(COMPLICATION_IDS.length);
- // Both TextPaint objects are used for all complications.
- mComplicationMainTextPaint = new TextPaint();
- mComplicationMainTextPaint.setColor(Color.WHITE);
- mComplicationMainTextPaint.setTextSize(COMPLICATION_MAIN_TEXT_SIZE);
- mComplicationMainTextPaint.setTypeface(
- Typeface.create(Typeface.DEFAULT, Typeface.BOLD));
- mComplicationMainTextPaint.setAntiAlias(true);
-
- mComplicationSubTextPaint = new TextPaint();
- mComplicationSubTextPaint.setColor(Color.WHITE);
- mComplicationSubTextPaint.setTextSize(COMPLICATION_SUB_TEXT_SIZE);
- mComplicationSubTextPaint.setTypeface(
- Typeface.create(Typeface.DEFAULT, Typeface.NORMAL));
- mComplicationSubTextPaint.setAntiAlias(true);
-
- // By default, all text is aligned to the center. If you want to change the text
- // alignment, use setAlignment() on your TextRenderer instance.
- mLeftMainTextComplicationRenderer = new TextRenderer();
- mLeftMainTextComplicationRenderer.setGravity(Gravity.BOTTOM);
- mLeftMainTextComplicationRenderer.setPaint(mComplicationMainTextPaint);
-
- mLeftSubTextComplicationRenderer = new TextRenderer();
- mLeftSubTextComplicationRenderer.setGravity(Gravity.TOP);
- mLeftSubTextComplicationRenderer.setPaint(mComplicationSubTextPaint);
-
- mRightMainTextComplicationRenderer = new TextRenderer();
- mRightMainTextComplicationRenderer.setGravity(Gravity.BOTTOM);
- mRightMainTextComplicationRenderer.setPaint(mComplicationMainTextPaint);
-
- mRightSubTextComplicationRenderer = new TextRenderer();
- mRightSubTextComplicationRenderer.setGravity(Gravity.TOP);
- mRightSubTextComplicationRenderer.setPaint(mComplicationSubTextPaint);
+ mComplicationPaint = new Paint();
+ mComplicationPaint.setColor(Color.WHITE);
+ mComplicationPaint.setTextSize(COMPLICATION_TEXT_SIZE);
+ mComplicationPaint.setTypeface(Typeface.create(Typeface.DEFAULT, Typeface.BOLD));
+ mComplicationPaint.setAntiAlias(true);
setActiveComplications(COMPLICATION_IDS);
}
@@ -314,10 +301,6 @@
}
}
});
-
- setWatchFaceStyle(new WatchFaceStyle.Builder(ComplicationSimpleWatchFaceService.this)
- .setAcceptsTapEvents(true)
- .build());
}
@Override
@@ -378,13 +361,34 @@
&& (complicationData.getType() != ComplicationData.TYPE_NOT_CONFIGURED)
&& (complicationData.getType() != ComplicationData.TYPE_EMPTY)) {
- if (mLeftComplicationMainTextBounds.contains(x, y)
- || mLeftComplicationSubTextBounds.contains(x, y)) {
- return LEFT_DIAL_COMPLICATION;
- } else if (mRightComplicationMainTextBounds.contains(x, y)
- || mRightComplicationSubTextBounds.contains(x, y)) {
- return RIGHT_DIAL_COMPLICATION;
+ Rect complicationBoundingRect = new Rect(0, 0, 0, 0);
+ switch (COMPLICATION_IDS[i]) {
+ case LEFT_COMPLICATION_ID:
+ complicationBoundingRect.set(
+ 0, // left
+ mComplicationsY - COMPLICATION_TAP_BUFFER, // top
+ (mWidth / 2), // right
+ ((int) COMPLICATION_TEXT_SIZE // bottom
+ + mComplicationsY
+ + COMPLICATION_TAP_BUFFER));
+ break;
+
+ case RIGHT_COMPLICATION_ID:
+ complicationBoundingRect.set(
+ (mWidth / 2), // left
+ mComplicationsY - COMPLICATION_TAP_BUFFER, // top
+ mWidth, // right
+ ((int) COMPLICATION_TEXT_SIZE // bottom
+ + mComplicationsY
+ + COMPLICATION_TAP_BUFFER));
+ break;
+ }
+
+ if (complicationBoundingRect.width() > 0) {
+ if (complicationBoundingRect.contains(x, y)) {
+ return COMPLICATION_IDS[i];
+ }
} else {
Log.e(TAG, "Not a recognized complication id.");
}
@@ -452,17 +456,7 @@
updateWatchHandStyle();
// Updates complication style
- mComplicationMainTextPaint.setAntiAlias(!inAmbientMode);
- mComplicationSubTextPaint.setAntiAlias(!inAmbientMode);
-
- // If the properties of the TextPaint have changed, then the TextRenderer may not be
- // aware that the layout needs to be updated. In this case, a layout update should be
- // forced by calling requestUpdateLayout().
- mLeftMainTextComplicationRenderer.requestUpdateLayout();
- mLeftSubTextComplicationRenderer.requestUpdateLayout();
-
- mRightMainTextComplicationRenderer.requestUpdateLayout();
- mRightSubTextComplicationRenderer.requestUpdateLayout();
+ mComplicationPaint.setAntiAlias(!inAmbientMode);
// Check and trigger whether or not timer should be running (only in active mode).
updateTimer();
@@ -534,28 +528,11 @@
mCenterX = mWidth / 2f;
mCenterY = mHeight / 2f;
- // Calculates Left and Right complications' bounds for TextRenderer.
- int top, left, bottom, right = 0;
- int heightOfComplication = height / 6;
-
- left = 0;
- top = (height / 2) - heightOfComplication;
- right = width / 2;
- bottom = height / 2;
- mLeftComplicationMainTextBounds = new Rect(left, top, right, bottom);
-
- left = right;
- right = width;
- mRightComplicationMainTextBounds = new Rect(left, top, right, bottom);
-
- top = height / 2;
- bottom = top + heightOfComplication;
- mRightComplicationSubTextBounds = new Rect(left, top, right, bottom);
-
- right = left;
- left = 0;
- mLeftComplicationSubTextBounds = new Rect(left, top, right, bottom);
-
+ /*
+ * Since the height of the complications text does not change, we only have to
+ * recalculate when the surface changes.
+ */
+ mComplicationsY = (int) ((mHeight / 2) + (mComplicationPaint.getTextSize() / 2));
/*
* Calculate lengths of different hands based on watch screen size.
@@ -617,6 +594,7 @@
}
private void drawBackground(Canvas canvas) {
+
if (mAmbient && (mLowBitAmbient || mBurnInProtection)) {
canvas.drawColor(Color.BLACK);
} else if (mAmbient) {
@@ -643,52 +621,47 @@
if (complicationData.getType() == ComplicationData.TYPE_SHORT_TEXT
|| complicationData.getType() == ComplicationData.TYPE_NO_PERMISSION) {
- if (COMPLICATION_IDS[i] == LEFT_DIAL_COMPLICATION) {
- // Set the text every time you draw, even if the ComplicationData has
- // not changed, in case the text includes a time-dependent value.
- mLeftMainTextComplicationRenderer.setText(
- ComplicationText.getText(
- getApplicationContext(),
- complicationData.getShortTitle(),
- currentTimeMillis));
+ ComplicationText mainText = complicationData.getShortText();
+ ComplicationText subText = complicationData.getShortTitle();
- mLeftSubTextComplicationRenderer.setText(
- ComplicationText.getText(
- getApplicationContext(),
- complicationData.getShortText(),
- currentTimeMillis));
+ CharSequence complicationMessage =
+ mainText.getText(getApplicationContext(), currentTimeMillis);
- // Assuming both the title and text exist.
- mLeftMainTextComplicationRenderer.draw(
- canvas,
- mLeftComplicationMainTextBounds);
- mLeftSubTextComplicationRenderer.draw(
- canvas,
- mLeftComplicationSubTextBounds);
-
- } else if (COMPLICATION_IDS[i] == RIGHT_DIAL_COMPLICATION) {
- // Set the text every time you draw, even if the ComplicationData has
- // not changed, in case the text includes a time-dependent value.
- mRightMainTextComplicationRenderer.setText(
- ComplicationText.getText(
- getApplicationContext(),
- complicationData.getShortTitle(),
- currentTimeMillis));
-
- mRightSubTextComplicationRenderer.setText(
- ComplicationText.getText(
- getApplicationContext(),
- complicationData.getShortText(),
- currentTimeMillis));
-
- // Assuming both the title and text exist.
- mRightMainTextComplicationRenderer.draw(
- canvas,
- mRightComplicationMainTextBounds);
- mRightSubTextComplicationRenderer.draw(
- canvas,
- mRightComplicationSubTextBounds);
+ /* In most cases you would want the subText (Title) under the
+ * mainText (Text), but to keep it simple for the code lab, we are
+ * concatenating them all on one line.
+ */
+ if (subText != null) {
+ complicationMessage = TextUtils.concat(
+ complicationMessage,
+ " ",
+ subText.getText(getApplicationContext(), currentTimeMillis));
}
+
+ //Log.d(TAG, "Com id: " + COMPLICATION_IDS[i] + "\t" + complicationMessage);
+ double textWidth =
+ mComplicationPaint.measureText(
+ complicationMessage,
+ 0,
+ complicationMessage.length());
+
+ int complicationsX;
+
+ if (COMPLICATION_IDS[i] == LEFT_COMPLICATION_ID) {
+ complicationsX = (int) ((mWidth / 2) - textWidth) / 2;
+ } else {
+ // RIGHT_COMPLICATION_ID calculations
+ int offset = (int) ((mWidth / 2) - textWidth) / 2;
+ complicationsX = (mWidth / 2) + offset;
+ }
+
+ canvas.drawText(
+ complicationMessage,
+ 0,
+ complicationMessage.length(),
+ complicationsX,
+ mComplicationsY,
+ mComplicationPaint);
}
}
}
@@ -768,6 +741,11 @@
/* Restore the canvas' original orientation. */
canvas.restore();
+
+ /* Draw rectangle behind peek card in ambient mode to improve readability. */
+ if (mAmbient) {
+ canvas.drawRect(mPeekCardBounds, mBackgroundPaint);
+ }
}
@Override
@@ -787,6 +765,12 @@
updateTimer();
}
+ @Override
+ public void onPeekCardPositionUpdate(Rect rect) {
+ super.onPeekCardPositionUpdate(rect);
+ mPeekCardBounds.set(rect);
+ }
+
private void registerReceiver() {
if (mRegisteredTimeZoneReceiver) {
return;
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/add_complication.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/add_complication.png
new file mode 100755
index 0000000..56f902d
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/add_complication.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/added_complication.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/added_complication.png
new file mode 100755
index 0000000..b253a81
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/added_complication.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/added_long_text_complication.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/added_long_text_complication.png
new file mode 100755
index 0000000..705ba87
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/added_long_text_complication.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/settings_overlay.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/settings_overlay.png
new file mode 100644
index 0000000..b99ba45
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/settings_overlay.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/settings_preview_placeholder.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/settings_preview_placeholder.png
new file mode 100644
index 0000000..cc45c50
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/settings_preview_placeholder.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/untappable_complication.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/untappable_complication.png
new file mode 100644
index 0000000..16ff1c5
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-360dpi/untappable_complication.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/add_complication.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/add_complication.png
new file mode 100755
index 0000000..b9df433
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/add_complication.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/added_complication.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/added_complication.png
new file mode 100755
index 0000000..c73de35
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/added_complication.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_expand_less_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_expand_less_white_18dp.png
new file mode 100644
index 0000000..508dc5f
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_expand_less_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_expand_more_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_expand_more_white_18dp.png
new file mode 100644
index 0000000..f21e0c3
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_expand_more_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_landscape_white.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_landscape_white.png
new file mode 100644
index 0000000..2d96d51
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_landscape_white.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_notifications_off_white_24dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_notifications_off_white_24dp.png
new file mode 100644
index 0000000..d2b23cf
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_notifications_off_white_24dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_notifications_white_24dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_notifications_white_24dp.png
new file mode 100644
index 0000000..d792f83
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/ic_notifications_white_24dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/icn_complications.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/icn_complications.png
new file mode 100644
index 0000000..0a6bac8
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/icn_complications.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/icn_styles.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/icn_styles.png
new file mode 100755
index 0000000..7204f52
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/icn_styles.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/preview_settings_complication_240.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/preview_settings_complication_240.png
new file mode 100644
index 0000000..e7c215b
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/preview_settings_complication_240.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/preview_settings_empty_240.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/preview_settings_empty_240.png
new file mode 100644
index 0000000..81a8fea
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/preview_settings_empty_240.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/settings_overlay.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/settings_overlay.png
new file mode 100644
index 0000000..40e3cc6
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/settings_overlay.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/settings_preview_placeholder.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/settings_preview_placeholder.png
new file mode 100644
index 0000000..6a468da
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-hdpi/settings_preview_placeholder.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_expand_less_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_expand_less_white_18dp.png
new file mode 100644
index 0000000..e4eabb5
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_expand_less_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_expand_more_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_expand_more_white_18dp.png
new file mode 100644
index 0000000..3be1f75
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_expand_more_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_landscape_white.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_landscape_white.png
new file mode 100644
index 0000000..f8a27f8
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_landscape_white.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_notifications_off_white_24dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_notifications_off_white_24dp.png
new file mode 100644
index 0000000..3fec9c7
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_notifications_off_white_24dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_notifications_white_24dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_notifications_white_24dp.png
new file mode 100644
index 0000000..2a5c93c
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-mdpi/ic_notifications_white_24dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/added_long_text_complication.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/added_long_text_complication.png
new file mode 100755
index 0000000..aed9ba7
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/added_long_text_complication.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_expand_less_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_expand_less_white_18dp.png
new file mode 100644
index 0000000..dea8988
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_expand_less_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_expand_more_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_expand_more_white_18dp.png
new file mode 100644
index 0000000..022e057
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_expand_more_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_landscape_white.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_landscape_white.png
new file mode 100644
index 0000000..21a2024
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_landscape_white.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_notifications_off_white_24dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_notifications_off_white_24dp.png
new file mode 100644
index 0000000..3e96f6d
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_notifications_off_white_24dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_notifications_white_24dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_notifications_white_24dp.png
new file mode 100644
index 0000000..9718ccf
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/ic_notifications_white_24dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/icn_complications.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/icn_complications.png
new file mode 100644
index 0000000..8d9bc24
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xhdpi/icn_complications.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxhdpi/ic_expand_less_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxhdpi/ic_expand_less_white_18dp.png
new file mode 100644
index 0000000..ddd0078
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxhdpi/ic_expand_less_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxhdpi/ic_expand_more_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxhdpi/ic_expand_more_white_18dp.png
new file mode 100644
index 0000000..82e6ac3
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxhdpi/ic_expand_more_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxhdpi/icn_complications.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxhdpi/icn_complications.png
new file mode 100644
index 0000000..ef745cb
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxhdpi/icn_complications.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxxhdpi/ic_expand_less_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxxhdpi/ic_expand_less_white_18dp.png
new file mode 100644
index 0000000..62fc386
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxxhdpi/ic_expand_less_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxxhdpi/ic_expand_more_white_18dp.png b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxxhdpi/ic_expand_more_white_18dp.png
new file mode 100644
index 0000000..dbc0b20
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/drawable-xxxhdpi/ic_expand_more_white_18dp.png
Binary files differ
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/layout/activity_complication_simple_config.xml b/wearable/wear/WatchFace/Wearable/src/main/res/layout/activity_complication_simple_config.xml
index d32ea10..884aa17 100644
--- a/wearable/wear/WatchFace/Wearable/src/main/res/layout/activity_complication_simple_config.xml
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/layout/activity_complication_simple_config.xml
@@ -14,25 +14,16 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
-<LinearLayout
+<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
- android:orientation="vertical"
android:background="@color/dark_grey"
- android:paddingTop="4dp">
-
- <TextView
- android:id="@+id/header"
- android:layout_width="match_parent"
- android:gravity="center"
- android:text="@string/complication_simple_config_name"
- android:textSize="20sp"
- android:layout_height="wrap_content"/>
-
- <android.support.wearable.view.WearableListView
- android:id="@+id/wearable_list"
+ android:paddingStart="30dp"
+ android:paddingEnd="30dp">
+ <android.support.wearable.view.WearableRecyclerView
+ android:id="@+id/wearable_recycler_view"
android:layout_height="wrap_content"
android:layout_width="match_parent">
- </android.support.wearable.view.WearableListView>
-</LinearLayout>
\ No newline at end of file
+ </android.support.wearable.view.WearableRecyclerView>
+</FrameLayout>
\ No newline at end of file
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/layout/config_list_appearance_item.xml b/wearable/wear/WatchFace/Wearable/src/main/res/layout/config_list_appearance_item.xml
new file mode 100644
index 0000000..31e0f23
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/layout/config_list_appearance_item.xml
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+ ~ Copyright (C) 2016 The Android Open Source Project
+ ~
+ ~ Licensed under the Apache License, Version 2.0 (the "License");
+ ~ you may not use this file except in compliance with the License.
+ ~ You may obtain a copy of the License at
+ ~
+ ~ http://www.apache.org/licenses/LICENSE-2.0
+ ~
+ ~ Unless required by applicable law or agreed to in writing, software
+ ~ distributed under the License is distributed on an "AS IS" BASIS,
+ ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ ~ See the License for the specific language governing permissions and
+ ~ limitations under the License.
+ -->
+<Button
+ xmlns:android="http://schemas.android.com/apk/res/android"
+ android:id="@+id/appearance_button"
+ android:layout_width="match_parent"
+ android:layout_height="match_parent"
+ style="@style/AppearanceSettingButton"
+ android:text="Appearance"/>
\ No newline at end of file
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/layout/config_list_complication_item.xml b/wearable/wear/WatchFace/Wearable/src/main/res/layout/config_list_complication_item.xml
new file mode 100644
index 0000000..52e3aa2
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/layout/config_list_complication_item.xml
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+ ~ Copyright (C) 2016 The Android Open Source Project
+ ~
+ ~ Licensed under the Apache License, Version 2.0 (the "License");
+ ~ you may not use this file except in compliance with the License.
+ ~ You may obtain a copy of the License at
+ ~
+ ~ http://www.apache.org/licenses/LICENSE-2.0
+ ~
+ ~ Unless required by applicable law or agreed to in writing, software
+ ~ distributed under the License is distributed on an "AS IS" BASIS,
+ ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ ~ See the License for the specific language governing permissions and
+ ~ limitations under the License.
+ -->
+<!-- Best Practice: Use a preview image that is 240 pixels or less. -->
+<ImageView
+ xmlns:android="http://schemas.android.com/apk/res/android"
+ android:id="@+id/watch_face_preview"
+ android:layout_width="match_parent"
+ android:layout_height="wrap_content"
+ android:scaleType="center"
+ android:src="@drawable/preview_settings_empty_240"/>
\ No newline at end of file
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/layout/config_list_more_options_item.xml b/wearable/wear/WatchFace/Wearable/src/main/res/layout/config_list_more_options_item.xml
new file mode 100644
index 0000000..a732545
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/layout/config_list_more_options_item.xml
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+ ~ Copyright (C) 2016 The Android Open Source Project
+ ~
+ ~ Licensed under the Apache License, Version 2.0 (the "License");
+ ~ you may not use this file except in compliance with the License.
+ ~ You may obtain a copy of the License at
+ ~
+ ~ http://www.apache.org/licenses/LICENSE-2.0
+ ~
+ ~ Unless required by applicable law or agreed to in writing, software
+ ~ distributed under the License is distributed on an "AS IS" BASIS,
+ ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ ~ See the License for the specific language governing permissions and
+ ~ limitations under the License.
+ -->
+<ImageView
+ xmlns:android="http://schemas.android.com/apk/res/android"
+ android:id="@+id/more_options_image_view"
+ android:layout_width="match_parent"
+ android:layout_height="wrap_content"
+ android:layout_centerHorizontal="true"
+ android:padding="10dp"
+ android:src="@drawable/ic_expand_more_white_18dp"/>
\ No newline at end of file
diff --git a/wearable/wear/WatchFace/Wearable/src/main/res/values/styles.xml b/wearable/wear/WatchFace/Wearable/src/main/res/values/styles.xml
new file mode 100644
index 0000000..bcf14d4
--- /dev/null
+++ b/wearable/wear/WatchFace/Wearable/src/main/res/values/styles.xml
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+ Copyright (C) 2016 The Android Open Source Project
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+-->
+<resources>
+ <style name="AppearanceSettingButton" parent="android:Widget.Holo.Button.Borderless">
+ <item name="android:padding">8dp</item>
+ <item name="android:textSize">18sp</item>
+ <item name="android:textColor">@color/white</item>
+ <item name="android:textAllCaps">false</item>
+ <item name="android:gravity">center_vertical|center_horizontal</item>
+ <item name="android:drawableLeft">@drawable/icn_styles</item>
+ </style>
+</resources>
\ No newline at end of file
