Zen QS: Tweak segmented button + introduction styling.

- Add a rounded rect background to the segmented buttons.
 - Remove the spacing between the segmented buttons.
 - Increase the minheight + font weight of the button text.
 - Remove the embedded divider line.
 - Add a rounded rect background to the intro messages.
 - Tweak margins, mostly 8dp -> 16dp in a few places.

Bug: 20949290
Bug: 20947407
Change-Id: Ic497c772aa7228423c8884d6ec7b9ccbfdda365a
This commit is contained in:
John Spurlock
2015-05-08 18:16:54 -04:00
parent a0698b617f
commit fbc1fdf88a
7 changed files with 57 additions and 13 deletions

View File

@@ -0,0 +1,22 @@
<!--
Copyright (C) 2015 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.
-->
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<corners android:radius="@dimen/borderless_button_radius" />
<solid android:color="@color/segmented_buttons_background" />
</shape>

View File

@@ -0,0 +1,22 @@
<!--
Copyright (C) 2015 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.
-->
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<corners android:radius="@dimen/borderless_button_radius" />
<solid android:color="@color/zen_introduction_message_background" />
</shape>

View File

@@ -25,4 +25,4 @@
android:textColor="@color/segmented_button_text_selector"
android:background="@drawable/btn_borderless_rect"
android:textAppearance="@style/TextAppearance.QS.SegmentedButton"
android:minHeight="64dp" />
android:minHeight="72dp" />

View File

@@ -24,31 +24,29 @@
<com.android.systemui.volume.SegmentedButtons
android:id="@+id/zen_buttons"
android:background="@drawable/segmented_buttons_background"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp" />
<View
android:id="@+id/zen_embedded_divider"
android:layout_width="match_parent"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginTop="8dp"
android:layout_height="1dp"
android:background="#4dffffff" />
android:layout_marginBottom="8dp" />
<RelativeLayout
android:id="@+id/zen_introduction"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingEnd="4dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:background="@color/zen_introduction_message_background" >
android:background="@drawable/zen_introduction_message_background" >
<ImageView
android:id="@+id/zen_introduction_confirm"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginEnd="8dp"
android:layout_alignParentEnd="true"
android:background="@drawable/btn_borderless_rect"
android:clickable="true"
@@ -73,7 +71,7 @@
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_marginEnd="4dp"
android:layout_marginEnd="12dp"
android:layout_below="@id/zen_introduction_message"
android:clickable="true"
android:focusable="true"

View File

@@ -127,6 +127,7 @@
<color name="screen_pinning_request_bg">#ff009688</color><!-- deep teal 500 -->
<color name="screen_pinning_request_window_bg">#80000000</color>
<color name="segmented_buttons_background">#14FFFFFF</color><!-- 8% white -->
<color name="segmented_button_selected">#FFFFFFFF</color>
<color name="segmented_button_unselected">#FFB0BEC5</color><!-- blue grey 200 -->

View File

@@ -188,7 +188,7 @@
<dimen name="qs_data_usage_text_size">14sp</dimen>
<dimen name="qs_data_usage_usage_text_size">36sp</dimen>
<dimen name="segmented_button_spacing">8dp</dimen>
<dimen name="segmented_button_spacing">0dp</dimen>
<dimen name="borderless_button_radius">2dp</dimen>
<!-- How far the expanded QS panel peeks from the header in collapsed state. -->

View File

@@ -166,6 +166,7 @@
<style name="TextAppearance.QS.SegmentedButton">
<item name="android:textSize">16sp</item>
<item name="android:fontFamily">sans-serif-medium</item>
</style>
<style name="TextAppearance.QS.DataUsage">