Skip to content

Commit

Permalink
[NavigationView] Integrated tokens.
Browse files Browse the repository at this point in the history
Changed the width from 280dp to 360dp

PiperOrigin-RevId: 499479992
  • Loading branch information
pekingme authored and afohrman committed Jan 5, 2023
1 parent acfd97f commit 8c8db7e
Show file tree
Hide file tree
Showing 6 changed files with 149 additions and 41 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
~ limitations under the License.
-->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="?attr/colorSecondaryContainer" android:state_activated="true"/>
<item android:color="?attr/colorSecondaryContainer" android:state_checked="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_active_indicator_color" android:state_activated="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_active_indicator_color" android:state_checked="true"/>
<item android:color="@android:color/transparent"/>
</selector>
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,26 @@
~ limitations under the License.
-->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:alpha="@dimen/material_emphasis_disabled" android:color="?attr/colorOnSurfaceVariant" android:state_enabled="false"/>
<item android:color="?attr/colorOnSecondaryContainer" android:state_checked="true"/>
<item android:color="?attr/colorOnSurfaceVariant"/>
<item android:alpha="@dimen/material_emphasis_disabled"
android:color="?attr/colorOnSurfaceVariant"
android:state_enabled="false"/>

<!-- Active item. -->
<item android:color="@macro/m3_comp_navigation_drawer_active_pressed_icon_color"
android:state_pressed="true" android:state_checked="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_active_focus_icon_color"
android:state_focused="true" android:state_checked="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_active_hover_icon_color"
android:state_hovered="true" android:state_checked="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_active_icon_color"
android:state_checked="true"/>

<!-- Inactive item. -->
<item android:color="@macro/m3_comp_navigation_drawer_inactive_pressed_icon_color"
android:state_pressed="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_inactive_focus_icon_color"
android:state_focused="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_inactive_hover_icon_color"
android:state_hovered="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_inactive_icon_color"/>
</selector>
Original file line number Diff line number Diff line change
Expand Up @@ -18,35 +18,31 @@

<!-- Selected -->

<!-- Uses the primary state layer since tapping a selected item keeps it
selected. -->
<item android:alpha="@dimen/m3_ripple_pressed_alpha"
android:color="?attr/colorPrimary"
android:state_pressed="true" android:state_selected="true"/>
<item android:alpha="@dimen/m3_ripple_focused_alpha"
android:color="?attr/colorOnSecondaryContainer"
android:state_focused="true" android:state_selected="true"/>
<item android:alpha="@dimen/m3_ripple_hovered_alpha"
android:color="?attr/colorOnSecondaryContainer"
android:state_hovered="true" android:state_selected="true"/>
<item android:alpha="@dimen/m3_comp_navigation_drawer_pressed_state_layer_opacity"
android:color="@macro/m3_comp_navigation_drawer_active_pressed_state_layer_color"
android:state_pressed="true" android:state_selected="true"/>
<item android:alpha="@dimen/m3_comp_navigation_drawer_focus_state_layer_opacity"
android:color="@macro/m3_comp_navigation_drawer_active_focus_state_layer_color"
android:state_focused="true" android:state_selected="true"/>
<item android:alpha="@dimen/m3_comp_navigation_drawer_hover_state_layer_opacity"
android:color="@macro/m3_comp_navigation_drawer_active_hover_state_layer_color"
android:state_hovered="true" android:state_selected="true"/>
<item android:alpha="@dimen/m3_ripple_default_alpha"
android:color="?attr/colorPrimary"
android:state_selected="true"/>
android:color="?attr/colorPrimary"
android:state_selected="true"/>

<!-- Not selected -->

<!-- Uses the primary state layer since tapping an non-selected item will
select it. -->
<item android:alpha="@dimen/m3_ripple_selectable_pressed_alpha"
android:color="?attr/colorPrimary"
android:state_pressed="true"/>
<item android:alpha="@dimen/m3_ripple_focused_alpha"
android:color="?attr/colorOnSurface"
android:state_focused="true"/>
<item android:alpha="@dimen/m3_ripple_hovered_alpha"
android:color="?attr/colorOnSurface"
android:state_hovered="true"/>
<item android:alpha="@dimen/m3_comp_navigation_drawer_pressed_state_layer_opacity"
android:color="@macro/m3_comp_navigation_drawer_inactive_pressed_state_layer_color"
android:state_pressed="true"/>
<item android:alpha="@dimen/m3_comp_navigation_drawer_focus_state_layer_opacity"
android:color="@macro/m3_comp_navigation_drawer_inactive_focus_state_layer_color"
android:state_focused="true"/>
<item android:alpha="@dimen/m3_comp_navigation_drawer_hover_state_layer_opacity"
android:color="@macro/m3_comp_navigation_drawer_inactive_hover_state_layer_color"
android:state_hovered="true"/>
<item android:alpha="@dimen/m3_ripple_default_alpha"
android:color="?attr/colorOnSurfaceVariant"/>
android:color="?attr/colorOnSurfaceVariant"/>

</selector>
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,23 @@
-->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:alpha="@dimen/material_emphasis_disabled" android:color="?attr/colorOnSurfaceVariant" android:state_enabled="false"/>
<item android:color="?attr/colorOnSecondaryContainer" android:state_checked="true"/>
<item android:color="?attr/colorOnSurfaceVariant"/>

<!-- Active item. -->
<item android:color="@macro/m3_comp_navigation_drawer_active_pressed_label_text_color"
android:state_pressed="true" android:state_checked="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_active_focus_label_text_color"
android:state_focused="true" android:state_checked="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_active_hover_label_text_color"
android:state_hovered="true" android:state_checked="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_active_label_text_color"
android:state_checked="true"/>

<!-- Inactive item. -->
<item android:color="@macro/m3_comp_navigation_drawer_inactive_pressed_label_text_color"
android:state_pressed="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_inactive_focus_label_text_color"
android:state_focused="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_inactive_hover_label_text_color"
android:state_hovered="true"/>
<item android:color="@macro/m3_comp_navigation_drawer_inactive_label_text_color"/>
</selector>
Original file line number Diff line number Diff line change
Expand Up @@ -53,9 +53,11 @@

<!-- Style for Material3 NavigationView. -->
<style name="Widget.Material3.NavigationView" parent="Widget.MaterialComponents.NavigationView">
<item name="subheaderColor">?attr/colorOnSurfaceVariant</item>
<item name="subheaderTextAppearance">?attr/textAppearanceTitleSmall</item>
<item name="elevation">@dimen/m3_sys_elevation_level0</item>
<item name="android:background">@macro/m3_comp_navigation_drawer_container_color</item>
<item name="android:maxWidth">@dimen/m3_comp_navigation_drawer_container_width</item>
<item name="subheaderColor">@macro/m3_comp_navigation_drawer_headline_color</item>
<item name="subheaderTextAppearance">@macro/m3_comp_navigation_drawer_headline_type</item>
<item name="elevation">@dimen/m3_comp_navigation_drawer_standard_container_elevation</item>
<item name="materialThemeOverlay">@style/ThemeOverlay.Material3.NavigationView</item>
<item name="itemShapeAppearance">@style/ShapeAppearance.Material3.Corner.Full</item>
<item name="itemShapeInsetStart">@dimen/m3_navigation_item_shape_inset_start</item>
Expand All @@ -65,7 +67,8 @@
<item name="itemIconPadding">@dimen/m3_navigation_item_icon_padding</item>
<item name="itemHorizontalPadding">@dimen/m3_navigation_item_horizontal_padding</item>
<item name="itemVerticalPadding">@dimen/m3_navigation_item_vertical_padding</item>
<item name="itemTextAppearance">?attr/textAppearanceLabelLarge</item>
<item name="itemTextAppearance">@macro/m3_comp_navigation_drawer_label_text_type</item>
<item name="itemIconSize">@dimen/m3_comp_navigation_drawer_icon_size</item>
<item name="itemIconTint">@color/m3_navigation_item_icon_tint</item>
<item name="itemRippleColor">@color/m3_navigation_item_ripple_color</item>
<item name="itemShapeFillColor">@color/m3_navigation_item_background_color</item>
Expand All @@ -79,19 +82,19 @@
<item name="drawerLayoutCornerSize">@dimen/m3_navigation_drawer_layout_corner_size</item>
</style>

<style name="ShapeAppearanceOverlay.Material3.NavigationView.Item" parent="">
<item name="cornerSize">50%</item>
</style>
<style name="ShapeAppearanceOverlay.Material3.NavigationView.Item"
parent="ShapeAppearance.M3.Comp.NavigationDrawer.ActiveIndicator.Shape"/>

<style name="ThemeOverlay.Material3.NavigationView" parent="">
<item name="android:listDivider">?attr/colorOutline</item>
</style>

<style name="ShapeAppearance.Material3.NavigationBarView.ActiveIndicator" parent="ShapeAppearance.Material3.Corner.Full"/>
<style name="ShapeAppearance.Material3.NavigationBarView.ActiveIndicator"
parent="ShapeAppearance.M3.Comp.NavigationDrawer.ActiveIndicator.Shape"/>

<!-- Style for Material3 DrawerLayout. -->
<style name="Widget.Material3.DrawerLayout" parent="android:Widget">
<item name="elevation">@dimen/m3_sys_elevation_level1</item>
<item name="elevation">@dimen/m3_comp_navigation_drawer_modal_container_elevation</item>
</style>

</resources>
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
<?xml version="1.0" encoding="utf-8"?>
<!--
~ Copyright (C) 2022 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.
-->
<!-- AUTOGENERATED FILE. DO NOT MODIFY. -->
<!-- Version: v0.147 -->

<resources>

<!-- Generated from token set (md.comp.navigation-drawer) in context (platform=android, audience=3p). -->
<!-- Enabled - Container -->
<macro name="m3_comp_navigation_drawer_container_color">?attr/colorSurface</macro>
<dimen name="m3_comp_navigation_drawer_modal_container_elevation">@dimen/m3_sys_elevation_level1</dimen>
<dimen name="m3_comp_navigation_drawer_standard_container_elevation">@dimen/m3_sys_elevation_level0</dimen>
<dimen name="m3_comp_navigation_drawer_container_width">360dp</dimen>
<!-- Enabled - Label text -->
<macro name="m3_comp_navigation_drawer_active_label_text_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_label_text_color">?attr/colorOnSurfaceVariant</macro>
<macro name="m3_comp_navigation_drawer_label_text_type">?attr/textAppearanceLabelLarge</macro>
<!-- Enabled - Icon -->
<macro name="m3_comp_navigation_drawer_active_icon_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_icon_color">?attr/colorOnSurfaceVariant</macro>
<dimen name="m3_comp_navigation_drawer_icon_size">24dp</dimen>
<!-- Enabled - Headline -->
<macro name="m3_comp_navigation_drawer_headline_color">?attr/colorOnSurfaceVariant</macro>
<macro name="m3_comp_navigation_drawer_headline_type">?attr/textAppearanceTitleSmall</macro>
<!-- Enabled - Active indicator -->
<macro name="m3_comp_navigation_drawer_active_indicator_color">?attr/colorSecondaryContainer</macro>
<style name="ShapeAppearance.M3.Comp.NavigationDrawer.ActiveIndicator.Shape" parent="ShapeAppearance.M3.Sys.Shape.Corner.Full"/>
<!-- Hovered - Label text -->
<macro name="m3_comp_navigation_drawer_active_hover_label_text_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_hover_label_text_color">?attr/colorOnSurface</macro>
<!-- Hovered - State layer -->
<macro name="m3_comp_navigation_drawer_active_hover_state_layer_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_hover_state_layer_color">?attr/colorOnSurface</macro>
<dimen name="m3_comp_navigation_drawer_hover_state_layer_opacity">@dimen/m3_sys_state_hover_state_layer_opacity</dimen>
<!-- Hovered - Icon -->
<macro name="m3_comp_navigation_drawer_active_hover_icon_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_hover_icon_color">?attr/colorOnSurface</macro>
<!-- Focused - Label text -->
<macro name="m3_comp_navigation_drawer_active_focus_label_text_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_focus_label_text_color">?attr/colorOnSurface</macro>
<!-- Focused - State layer -->
<macro name="m3_comp_navigation_drawer_active_focus_state_layer_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_focus_state_layer_color">?attr/colorOnSurface</macro>
<dimen name="m3_comp_navigation_drawer_focus_state_layer_opacity">@dimen/m3_sys_state_focus_state_layer_opacity</dimen>
<!-- Focused - Icon -->
<macro name="m3_comp_navigation_drawer_active_focus_icon_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_focus_icon_color">?attr/colorOnSurface</macro>
<!-- Pressed (rippple) - Label text -->
<macro name="m3_comp_navigation_drawer_active_pressed_label_text_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_pressed_label_text_color">?attr/colorOnSurface</macro>
<!-- Pressed (rippple) - State layer -->
<macro name="m3_comp_navigation_drawer_active_pressed_state_layer_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_pressed_state_layer_color">?attr/colorOnSecondaryContainer</macro>
<dimen name="m3_comp_navigation_drawer_pressed_state_layer_opacity">@dimen/m3_sys_state_pressed_state_layer_opacity</dimen>
<!-- Pressed (rippple) - Icon -->
<macro name="m3_comp_navigation_drawer_active_pressed_icon_color">?attr/colorOnSecondaryContainer</macro>
<macro name="m3_comp_navigation_drawer_inactive_pressed_icon_color">?attr/colorOnSurface</macro>

</resources>

0 comments on commit 8c8db7e

Please sign in to comment.