Use custom ViewPagerTabs
Use the custom ViewPagerTabs from contacts common.
In portrait, the tabs are below the toolbar. In landscape
the tabs are inside the toolbar.
Bug: 16158921
Bug: 15616182
Change-Id: I6c2067fdc10fa15ebd6e0fa93aa1c4f8e7cd45a7
diff --git a/res/drawable/action_bar_tab.xml b/res/drawable/action_bar_tab.xml
deleted file mode 100644
index 3982a3b..0000000
--- a/res/drawable/action_bar_tab.xml
+++ /dev/null
@@ -1,38 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
- Copyright (C) 2013 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.
--->
-<ripple xmlns:android="http://schemas.android.com/apk/res/android"
- android:color="@color/tab_pressed_color">
- <item>
- <selector>
- <item android:drawable="@drawable/tab_selected"
- android:state_focused="false"
- android:state_pressed="false"
- android:state_selected="true" />
- <item android:drawable="@drawable/tab_selected_focused"
- android:state_focused="true"
- android:state_pressed="false"
- android:state_selected="true" />
- <item android:drawable="@drawable/tab_unselected_focused"
- android:state_focused="true"
- android:state_pressed="false"
- android:state_selected="false" />
- <item android:drawable="@drawable/tab_selected"
- android:state_selected="true" />
- <item android:drawable="@color/tab_default_color" />
- </selector>
- </item>
-</ripple>
\ No newline at end of file
diff --git a/res/drawable/tab_selected.xml b/res/drawable/tab_selected.xml
deleted file mode 100644
index 9eec3c4..0000000
--- a/res/drawable/tab_selected.xml
+++ /dev/null
@@ -1,23 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
- Copyright (C) 2013 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.
--->
-<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
- <!-- Tab selected underline -->
- <item android:drawable="@color/tab_selected_color" />
- <!-- Tab background -->
- <item android:drawable="@color/tab_default_color"
- android:bottom="@dimen/tab_selected_underline_height" />
-</layer-list>
\ No newline at end of file
diff --git a/res/drawable/tab_selected_focused.xml b/res/drawable/tab_selected_focused.xml
deleted file mode 100644
index ba5162a..0000000
--- a/res/drawable/tab_selected_focused.xml
+++ /dev/null
@@ -1,31 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
- Copyright (C) 2013 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.
--->
-<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
- <!-- Tab selected underline -->
- <item android:drawable="@color/tab_selected_color" />
- <!-- Tab background -->
- <item android:drawable="@color/tab_default_color"
- android:bottom="@dimen/tab_selected_underline_height" />
- <!-- Focus rectangle -->
- <item>
- <shape android:shape="rectangle" >
- <stroke
- android:width="@dimen/tab_focused_stroke_width"
- android:color="@color/focus_color" />
- </shape>
- </item>
-</layer-list>
\ No newline at end of file
diff --git a/res/drawable/tab_unselected_focused.xml b/res/drawable/tab_unselected_focused.xml
deleted file mode 100644
index 1e4c6c3..0000000
--- a/res/drawable/tab_unselected_focused.xml
+++ /dev/null
@@ -1,28 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
- Copyright (C) 2013 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.
--->
-<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
- <!-- Tab background -->
- <item android:drawable="@color/tab_default_color" />
- <!-- Focus rectangle -->
- <item>
- <shape android:shape="rectangle" >
- <stroke
- android:width="@dimen/tab_focused_stroke_width"
- android:color="@color/focus_color" />
- </shape>
- </item>
-</layer-list>
\ No newline at end of file
diff --git a/res/drawable/view_pager_tab_background.xml b/res/drawable/view_pager_tab_background.xml
new file mode 100644
index 0000000..1ba6c57
--- /dev/null
+++ b/res/drawable/view_pager_tab_background.xml
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+ ~ Copyright (C) 2014 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
+ -->
+<ripple xmlns:android="http://schemas.android.com/apk/res/android"
+ android:color="@color/tab_ripple_color">
+ <item android:id="@android:id/mask">
+ <color android:color="@android:color/white" />
+ </item>
+</ripple>
\ No newline at end of file
diff --git a/res/layout-land/people_activity_toolbar.xml b/res/layout-land/people_activity_toolbar.xml
new file mode 100644
index 0000000..1f86879
--- /dev/null
+++ b/res/layout-land/people_activity_toolbar.xml
@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2014 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.
+-->
+
+<!-- Need to set a non null background on Toolbar in order for MenuItem ripples to be drawn on
+ this view, instead of another. This will *not* cause an additional draw since the
+ background is transparent.-->
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+ android:id="@+id/toolbar_parent"
+ android:orientation="vertical"
+ android:layout_width="match_parent"
+ android:background="#00000000"
+ android:elevation="@dimen/tab_elevation"
+ android:layout_height="wrap_content" >
+
+ <Toolbar
+ android:layout_width="match_parent"
+ android:layout_height="?android:attr/actionBarSize"
+ android:background="@color/actionbar_background_color"
+ android:id="@+id/toolbar"
+ style="@style/ContactsToolbarStyle" />
+
+</LinearLayout>
\ No newline at end of file
diff --git a/res/layout/people_activity.xml b/res/layout/people_activity.xml
index 6b65945..2624818 100644
--- a/res/layout/people_activity.xml
+++ b/res/layout/people_activity.xml
@@ -19,6 +19,10 @@
android:layout_width="match_parent"
android:layout_height="match_parent">
+ <include
+ layout="@layout/people_activity_toolbar"
+ android:id="@+id/toolbar_parent" />
+
<!--
ViewPager for swiping between tabs. We put StrequentContactListFragment,
DefaultContactBrowseListFragment and GroupBrowseListFragment at runtime.
@@ -30,6 +34,7 @@
android:id="@+id/tab_pager"
android:layout_height="match_parent"
android:layout_width="match_parent"
+ android:layout_below="@id/toolbar_parent"
/>
<FrameLayout
diff --git a/res/layout/people_activity_tabs_lands.xml b/res/layout/people_activity_tabs_lands.xml
new file mode 100644
index 0000000..525ac3c
--- /dev/null
+++ b/res/layout/people_activity_tabs_lands.xml
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2014 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.
+-->
+
+<com.android.contacts.common.list.ViewPagerTabs
+ xmlns:android="http://schemas.android.com/apk/res/android"
+ android:id="@+id/lists_pager_header"
+ android:layout_width="@dimen/people_activity_landscape_tabs_width"
+ android:layout_height="match_parent"
+ android:textAllCaps="true"
+ android:orientation="horizontal"
+ android:layout_gravity="top"
+ android:layout_weight="0"
+ android:textSize="@dimen/people_activity_landscape_tabs_text_size"
+ style="@style/ContactsActionBarTabTextStyle" />
diff --git a/res/layout/people_activity_toolbar.xml b/res/layout/people_activity_toolbar.xml
new file mode 100644
index 0000000..fe5be04
--- /dev/null
+++ b/res/layout/people_activity_toolbar.xml
@@ -0,0 +1,46 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2014 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.
+-->
+
+<!-- Need to set a non null background on Toolbar in order for MenuItem ripples to be drawn on
+ this view, instead of another. This will *not* cause an additional draw since the
+ background is transparent.-->
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+ android:id="@+id/toolbar_parent"
+ android:orientation="vertical"
+ android:layout_width="match_parent"
+ android:background="#00000000"
+ android:elevation="@dimen/tab_elevation"
+ android:layout_height="wrap_content" >
+
+ <Toolbar
+ android:layout_width="match_parent"
+ android:layout_height="?android:attr/actionBarSize"
+ android:background="@color/actionbar_background_color"
+ android:id="@+id/toolbar"
+ style="@style/ContactsToolbarStyle" />
+
+ <com.android.contacts.common.list.ViewPagerTabs
+ android:id="@+id/lists_pager_header"
+ android:layout_width="match_parent"
+ android:layout_height="?android:attr/actionBarSize"
+ android:textAllCaps="true"
+ android:orientation="horizontal"
+ android:layout_gravity="top"
+ android:layout_weight="0"
+ android:layout_below="@id/toolbar"
+ style="@style/ContactsActionBarTabTextStyle" />
+
+</LinearLayout>
\ No newline at end of file
diff --git a/res/values-w470dp/dimens.xml b/res/values-w470dp/dimens.xml
new file mode 100644
index 0000000..2c04e5d
--- /dev/null
+++ b/res/values-w470dp/dimens.xml
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2014 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>
+
+ <!-- The width the that the tabs occupy in the ActionBar when in landscape mode.
+ 470dp is the height of a "normal" screen. We should leave 240dp for
+ the title and menu items -->
+ <dimen name="people_activity_landscape_tabs_width">230dip</dimen>
+ <!-- The size of the text displayed in the ActionBar tabs in landscape mode.
+ Text in the tabs should must be width dependent, otherwise it won't fit in the tabs.
+ In portrait mode, the tabs look okay when overflowing their allocated space.
+ We have to be more careful in landscape. -->
+ <dimen name="people_activity_landscape_tabs_text_size">9dp</dimen>
+
+</resources>
\ No newline at end of file
diff --git a/res/values-w590dp/dimens.xml b/res/values-w590dp/dimens.xml
new file mode 100644
index 0000000..2fff6ca
--- /dev/null
+++ b/res/values-w590dp/dimens.xml
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2014 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>
+
+ <!-- The width the that the tabs occupy in the ActionBar when in landscape mode.
+ 590dp is almost the height of a "large" screen. We should leave 240dp for
+ the title and menu items -->
+ <dimen name="people_activity_landscape_tabs_width">350dip</dimen>
+ <!-- The size of the text displayed in the ActionBar tabs in landscape mode.
+ Text in the tabs should must be width dependent, otherwise it won't fit in the tabs.
+ In portrait mode, the tabs look okay when overflowing their allocated space.
+ We have to be more careful in landscape. -->
+ <dimen name="people_activity_landscape_tabs_text_size">14dp</dimen>
+
+</resources>
\ No newline at end of file
diff --git a/res/values/colors.xml b/res/values/colors.xml
index 562241e..beedf6a 100644
--- a/res/values/colors.xml
+++ b/res/values/colors.xml
@@ -61,8 +61,4 @@
<!-- Background color of pinned header items. -->
<color name="list_item_pinned_header_color">#f5f5f5</color>
-
- <color name="tab_default_color">@color/actionbar_background_color</color>
- <color name="tab_pressed_color">@color/tab_selected_color</color>
- <color name="tab_selected_color">#ffeeff41</color>
</resources>
diff --git a/res/values/dimens.xml b/res/values/dimens.xml
index 40adc95..d86d9d7 100644
--- a/res/values/dimens.xml
+++ b/res/values/dimens.xml
@@ -188,6 +188,15 @@
<dimen name="expanding_entry_card_item_alternate_icon_margin_bottom">10dp</dimen>
<dimen name="people_activity_card_elevation">2dp</dimen>
+ <!-- The width the that the tabs occupy in the ActionBar when in landscape mode.
+ 426dp is the height of a "small" screen. We should leave 240dp for
+ the title and menu items -->
+ <dimen name="people_activity_landscape_tabs_width">186dip</dimen>
+ <!-- The size of the text displayed in the ActionBar tabs in landscape mode.
+ Text in the tabs should must be width dependent, otherwise it won't fit in the tabs.
+ In portrait mode, the tabs look okay when overflowing their allocated space.
+ We have to be more careful in landscape. -->
+ <dimen name="people_activity_landscape_tabs_text_size">8dp</dimen>
<dimen name="expanding_entry_card_item_icon_height">24dp</dimen>
<dimen name="expanding_entry_card_item_icon_width">24dp</dimen>
diff --git a/res/values/styles.xml b/res/values/styles.xml
index a1a01d1..1eae4d0 100644
--- a/res/values/styles.xml
+++ b/res/values/styles.xml
@@ -50,8 +50,6 @@
<style name="PeopleTheme" parent="@android:style/Theme.Material.Light">
<item name="android:actionBarStyle">@style/ContactsActionBarStyle</item>
- <!-- Style for the tabs -->
- <item name="android:actionBarTabStyle">@style/ContactsActionBarTabStyle</item>
<!-- Style for the tab bar (for the divider between tabs) -->
<item name="android:actionBarTabBarStyle">@style/ContactsActionBarTabBarStyle</item>
<!-- Style for the tab bar text (for text on tabs) -->
@@ -111,17 +109,17 @@
<item name="android:icon">@android:color/transparent</item>
</style>
+ <!-- When this style was added, android:toolbarStyle was private. Therefore, this style
+ must be directly applied to every toolbar -->
+ <style name="ContactsToolbarStyle" parent="@android:style/Widget.Toolbar">
+ <item name="android:titleTextAppearance">@style/ContactsActionBarTitleText</item>
+ </style>
+
<style name="ContactsPickerActionBarStyle" parent="@style/ContactsActionBarStyle">
<!-- when first loading, don't show title or up button -->
<item name="android:displayOptions"></item>
</style>
- <!-- Styling for tabs. -->
- <style name="ContactsActionBarTabStyle" parent="@android:style/Widget.Material.Light.ActionBar.TabView">
- <item name="android:background">@drawable/action_bar_tab</item>
- <item name="android:showDividers">none</item>
- </style>
-
<!-- Text in the action bar at the top of the screen -->
<style name="ContactsActionBarTitleText"
parent="@android:style/TextAppearance.Material.Widget.ActionBar.Title">
@@ -160,10 +158,6 @@
<item name="android:dropDownListViewStyle">@style/ListViewDropdownStyle</item>
</style>
- <style name="ContactsActionBarTabView" parent="@android:style/Widget.Holo.ActionBar.TabView">
- <item name="android:background">@drawable/action_bar_tab</item>
- </style>
-
<style name="ListViewDropdownStyle" parent="@android:style/Widget.ListView.DropDown">
<item name="android:listSelector">?android:attr/listChoiceBackgroundIndicator</item>
</style>