Fabio/Auxio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ui: improve tablet ux

Browse source 
Remove some UI breakages and tweak the UI to be better for tablet
users.
This commit is contained in:
OxygenCobalt 2022-06-17 16:30:14 -06:00
parent 09442c475f
commit eaad3d04b8
No known key found for this signature in database
GPG key ID: 37DBE3621FE9AD47
15 changed files with 33 additions and 74 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/src/main/java/org/oxycblt/auxio/home/AdaptiveTabStrategy.kt
View file

@ -41,7 +41,7 @@ class AdaptiveTabStrategy(context: Context, private val homeModel: HomeViewModel
logD("Using icon-only configuration")
tab.setIcon(tabMode.icon).setContentDescription(tabMode.string)
}
width < 640 -> {
width < 600 -> {
logD("Using text-only configuration")
tab.setText(tabMode.string)
}

2
app/src/main/res/layout-land/fragment_playback_panel.xml
View file

@ -23,7 +23,7 @@
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playback_toolbar"
app:layout_constraintVertical_chainStyle="packed"
tools:src="@drawable/ic_album" />
tools:staticIcon="@drawable/ic_album" />
<!-- TextView is wrapped in a container so that marquee doesn't break -->

10
app/src/main/res/layout-sw600dp-land/fragment_playback_panel.xml
View file

@ -23,7 +23,7 @@
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playback_toolbar"
tools:src="@drawable/ic_album" />
tools:staticIcon="@drawable/ic_album" />
<!-- TextView is wrapped in a container so that marquee doesn't break -->
@ -76,12 +76,12 @@
android:id="@+id/playback_seek_bar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_small"
android:layout_marginEnd="@dimen/spacing_small"
android:layout_marginStart="-16dp"
android:layout_marginEnd="-16dp"
app:layout_constraintBottom_toTopOf="@+id/playback_play_pause"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintEnd_toEndOf="@+id/playback_album"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/playback_cover"
app:layout_constraintStart_toStartOf="@+id/playback_album"
app:layout_constraintTop_toBottomOf="@+id/playback_album" />
<org.oxycblt.auxio.playback.IndicatorMaterialButton

0
app/src/main/res/layout-sw640dp/fragment_playback_bar.xml → app/src/main/res/layout-sw600dp/fragment_playback_bar.xml
View file

2
app/src/main/res/layout-sw600dp/fragment_playback_panel.xml
View file

@ -23,7 +23,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playback_toolbar"
tools:src="@drawable/ic_album" />
tools:staticIcon="@drawable/ic_album" />
<TextView
android:id="@+id/playback_song"

2
app/src/main/res/layout-w600dp-land/fragment_playback_panel.xml
View file

@ -22,7 +22,7 @@
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playback_toolbar"
tools:src="@drawable/ic_album" />
tools:staticIcon="@drawable/ic_album" />
<!-- TextView is wrapped in a container so that marquee doesn't break -->

4
app/src/main/res/layout/dialog_pre_amp.xml
View file

@ -40,7 +40,7 @@
android:layout_height="wrap_content"
android:layout_marginEnd="@dimen/spacing_mid_large"
android:gravity="center"
android:minWidth="@dimen/size_btn_large"
android:minWidth="@dimen/size_pre_amp_ticker"
android:textAppearance="@style/TextAppearance.Auxio.BodyMedium"
app:layout_constraintBottom_toBottomOf="@+id/with_tags_slider"
app:layout_constraintEnd_toEndOf="parent"
@ -77,7 +77,7 @@
android:layout_height="wrap_content"
android:layout_marginEnd="@dimen/spacing_mid_large"
android:gravity="center"
android:minWidth="@dimen/size_btn_large"
android:minWidth="@dimen/size_pre_amp_ticker"
android:textAppearance="@style/TextAppearance.Auxio.BodyMedium"
app:layout_constraintBottom_toBottomOf="@+id/without_tags_slider"
app:layout_constraintEnd_toEndOf="parent"

2
app/src/main/res/layout/fragment_playback_panel.xml
View file

@ -22,7 +22,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playback_toolbar"
tools:placeholderIcon="@drawable/ic_song" />
tools:staticIcon="@drawable/ic_album" />
<TextView
android:id="@+id/playback_song"

38
app/src/main/res/layout/item_artist.xml
View file

@ -1,38 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
style="@style/Widget.Auxio.ItemLayout">
<org.oxycblt.auxio.image.StyledImageView
android:id="@+id/artist_image"
style="@style/Widget.Auxio.Image.Medium"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:staticIcon="@drawable/ic_artist" />
<TextView
android:id="@+id/artist_name"
style="@style/Widget.Auxio.TextView.Item.Primary"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="@+id/artist_info"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/artist_image"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="packed"
tools:text="Artist Name" />
<TextView
android:id="@+id/artist_info"
style="@style/Widget.Auxio.TextView.Item.Secondary"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/artist_image"
app:layout_constraintTop_toBottomOf="@+id/artist_name"
tools:text="2 Albums, 20 Songs" />
</androidx.constraintlayout.widget.ConstraintLayout>

4
app/src/main/res/layout/widget_thin.xml
View file

@ -95,8 +95,8 @@
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="@string/desc_play_pause"
android:minWidth="@dimen/size_btn_small"
android:minHeight="@dimen/size_btn_small"
android:minWidth="@dimen/size_btn"
android:minHeight="@dimen/size_btn"
android:src="@drawable/ic_play" />

4
app/src/main/res/values-sw600dp/styles_ui.xml
View file

@ -24,4 +24,8 @@
<item name="navigationIcon">@drawable/ic_down</item>
<item name="android:layout_marginStart">@dimen/spacing_small_inv</item>
</style>
<style name="Widget.Auxio.RecyclerView.WithAdaptiveFab" parent="">
<item name="android:paddingBottom">@dimen/recycler_fab_space_large</item>
</style>
</resources>

5
app/src/main/res/values-sw640dp/styles_ui.xml
View file

@ -1,10 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Widget.Auxio.RecyclerView.WithAdaptiveFab" parent="">
<item name="android:paddingBottom">@dimen/recycler_fab_space_large</item>
</style>
<style name="Widget.Auxio.FloatingActionButton.Adaptive" parent="Widget.Material3.FloatingActionButton.Large.Primary">
<item name="fabSize">normal</item>
</style>

10
app/src/main/res/values/dimens.xml
View file

@ -14,12 +14,8 @@
<dimen name="spacing_button_dialog">12dp</dimen>
<!-- Size Namespace | Width & Heights for UI elements -->
<dimen name="size_btn_small">48dp</dimen>
<dimen name="size_btn_large">64dp</dimen>
<dimen name="size_cover_compact">48dp</dimen>
<dimen name="size_cover_normal">56dp</dimen>
<dimen name="size_cover_mid_large">88dp</dimen>
<dimen name="size_cover_large">128dp</dimen>
<dimen name="size_cover_mid_huge">192dp</dimen>
<dimen name="size_cover_huge">256dp</dimen>
@ -27,10 +23,14 @@
<dimen name="size_corners_small">8dp</dimen>
<dimen name="size_corners_large">16dp</dimen>
<dimen name="size_btn">48dp</dimen>
<dimen name="size_play_pause_button">72dp</dimen>
<dimen name="size_icon_small">24dp</dimen>
<dimen name="size_icon_medium">28dp</dimen>
<dimen name="size_icon_large">32dp</dimen>
<dimen name="size_pre_amp_ticker">64dp</dimen>
<dimen name="text_size_ext_label_larger">16sp</dimen>
<dimen name="text_size_ext_title_mid_large">18sp</dimen>
<dimen name="text_size_track_number_min">12sp</dimen>

8
app/src/main/res/values/styles_android.xml
View file

@ -71,7 +71,7 @@
<!-- A variant of PlaybackButton that plays along with AppWidget restrictions. -->
<style name="Widget.Auxio.PlaybackButton.AppWidget" parent="Widget.Auxio.Button.AppWidget.V31">
<item name="android:minHeight">@dimen/size_btn_small</item>
<item name="android:minHeight">@dimen/size_btn</item>
<item name="android:scaleType">fitCenter</item>
<item name="android:padding">@dimen/spacing_small</item>
</style>
@ -89,7 +89,7 @@
56dp to 48dp.
-->
<style name="Widget.Auxio.Toolbar.Navigation" parent="Widget.AppCompat.Toolbar.Button.Navigation">
<item name="android:minWidth">@dimen/size_btn_small</item>
<item name="android:minWidth">@dimen/size_btn</item>
</style>
<!--
@ -97,8 +97,8 @@
(presumably for compat with older devices)
-->
<style name="Widget.Auxio.Button.Overflow" parent="Widget.AppCompat.ActionButton.Overflow">
<item name="android:minWidth">@dimen/size_btn_small</item>
<item name="android:minHeight">@dimen/size_btn_small</item>
<item name="android:minWidth">@dimen/size_btn</item>
<item name="android:minHeight">@dimen/size_btn</item>
<item name="android:paddingStart">0dp</item>
<item name="android:paddingEnd">0dp</item>
</style>

14
app/src/main/res/values/styles_ui.xml
View file

@ -18,7 +18,7 @@
Material guidelines state that there should be 16dp end padding with actions,
but Toolbar only has 12dp. Fix that by adding a 4dp margin.
-->
<item name="android:layout_marginEnd">4dp</item>
<item name="android:layout_marginEnd">@dimen/spacing_tiny</item>
</style>
\
@ -58,10 +58,8 @@
<item name="iconPadding">0dp</item>
<item name="iconTint">?attr/colorControlNormal</item>
<item name="rippleColor">?attr/colorControlHighlight</item>
<item name="android:minWidth">@dimen/size_btn_small</item>
<item name="android:minHeight">@dimen/size_btn_small</item>
<item name="android:maxWidth">@dimen/size_btn_small</item>
<item name="android:maxHeight">@dimen/size_btn_small</item>
<item name="android:minWidth">@dimen/size_btn</item>
<item name="android:minHeight">@dimen/size_btn</item>
</style>
<style name="Widget.Auxio.Button.Icon.Small" parent="Widget.Auxio.Button.Icon.Base">
@ -197,7 +195,7 @@
<item name="android:paddingTop">@dimen/spacing_small</item>
<item name="android:paddingBottom">@dimen/spacing_small</item>
<item name="android:paddingEnd">@dimen/spacing_medium</item>
<item name="android:minHeight">@dimen/size_btn_small</item>
<item name="android:minHeight">@dimen/size_btn</item>
<item name="android:gravity">center_vertical</item>
<item name="android:textAppearance">@style/TextAppearance.Auxio.LabelLarger</item>
</style>
@ -238,9 +236,9 @@
compensate.
2. For some reason elevation behaves strangely in the playback panel, so we disable it.
-->
<item name="fabSize">normal</item>
<item name="fabCustomSize">@dimen/size_btn_large</item>
<item name="maxImageSize">@dimen/size_icon_large</item>
<item name="fabCustomSize">@dimen/size_play_pause_button</item>
<item name="fabSize">normal</item>
<item name="android:elevation">0dp</item>
<item name="elevation">0dp</item>
</style>