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

playback: resize elements

Browse source 
- Center toolbar fully to look better w/o text spacing
- Move more button back to song info since it's semantically closer there
This commit is contained in:
Alexander Capehart 2024-04-19 13:19:54 -06:00
parent 9990e00a4a
commit 823e04b073
No known key found for this signature in database
GPG key ID: 37DBE3621FE9AD47
7 changed files with 87 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
app/src/main/java/org/oxycblt/auxio/playback/PlaybackPanelFragment.kt
View file

@ -44,7 +44,6 @@ import org.oxycblt.auxio.playback.ui.SwipeCoverView
import org.oxycblt.auxio.ui.ViewBindingFragment
import org.oxycblt.auxio.util.collectImmediately
import org.oxycblt.auxio.util.logD
import org.oxycblt.auxio.util.overrideOnOverflowMenuClick
import org.oxycblt.auxio.util.showToast
import org.oxycblt.auxio.util.systemBarInsetsCompat
@ -94,13 +93,6 @@ class PlaybackPanelFragment :
binding.playbackToolbar.apply {
setNavigationOnClickListener { playbackModel.openMain() }
setOnMenuItemClickListener(this@PlaybackPanelFragment)
overrideOnOverflowMenuClick {
playbackModel.song.value?.let {
// No playback options are actually available in the menu, so use a junk
// PlaySong option.
listModel.openMenu(R.menu.playback_song, it, PlaySong.ByItself)
}
}
}
binding.playbackCover.onSwipeListener = this
@ -120,6 +112,11 @@ class PlaybackPanelFragment :
binding.playbackPlayPause.setOnClickListener { playbackModel.togglePlaying() }
binding.playbackSkipNext.setOnClickListener { playbackModel.next() }
binding.playbackShuffle.setOnClickListener { playbackModel.toggleShuffled() }
binding.playbackMore?.setOnClickListener {
playbackModel.song.value?.let {
listModel.openMenu(R.menu.playback_song, it, PlaySong.ByItself)
}
}
// --- VIEWMODEL SETUP --
collectImmediately(playbackModel.song, ::updateSong)

11
app/src/main/res/drawable/ic_like_24.xml Normal file
View file

@ -0,0 +1,11 @@
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="960"
android:viewportHeight="960"
android:tint="?attr/colorControlNormal">
<path
android:fillColor="@android:color/white"
android:pathData="M480,840L422,788Q321,697 255,631Q189,565 150,512.5Q111,460 95.5,416Q80,372 80,326Q80,232 143,169Q206,106 300,106Q352,106 399,128Q446,150 480,190Q514,150 561,128Q608,106 660,106Q754,106 817,169Q880,232 880,326Q880,372 864.5,416Q849,460 810,512.5Q771,565 705,631Q639,697 538,788L480,840ZM480,732Q576,646 638,584.5Q700,523 736,477.5Q772,432 786,396.5Q800,361 800,326Q800,266 760,226Q720,186 660,186Q613,186 573,212.5Q533,239 518,280L518,280L442,280L442,280Q427,239 387,212.5Q347,186 300,186Q240,186 200,226Q160,266 160,326Q160,361 174,396.5Q188,432 224,477.5Q260,523 322,584.5Q384,646 480,732ZM480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459L480,459L480,459L480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Q480,459 480,459Z"/>
</vector>

38
app/src/main/res/layout-h480dp/fragment_playback_panel.xml
View file

@ -12,6 +12,10 @@
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:menu="@menu/toolbar_playback"
app:titleCentered="true"
app:subtitleCentered="true"
app:titleTextAppearance="@style/TextAppearance.Auxio.TitleMediumEmphasis"
app:subtitleTextAppearance="@style/TextAppearance.Auxio.BodySmall"
app:navigationIcon="@drawable/ic_down_24"
app:title="@string/lbl_playback"
tools:subtitle="@string/lbl_all_songs" />
@ -30,12 +34,13 @@
<TextView
android:id="@+id/playback_song"
style="@style/Widget.Auxio.TextView.Primary"
android:layout_width="match_parent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:layout_marginEnd="@dimen/spacing_medium"
android:layout_marginHorizontal="@dimen/spacing_tiny"
android:layout_marginEnd="@dimen/spacing_mid_medium"
app:layout_constraintBottom_toTopOf="@+id/playback_artist"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintEnd_toStartOf="@+id/playback_more"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintVertical_chainStyle="packed"
tools:text="Song Name" />
@ -43,25 +48,21 @@
<TextView
android:id="@+id/playback_artist"
style="@style/Widget.Auxio.TextView.Secondary.Marquee"
android:layout_width="match_parent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:layout_marginEnd="@dimen/spacing_medium"
app:layout_constraintBottom_toTopOf="@+id/playback_album"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="@+id/playback_song"
app:layout_constraintStart_toStartOf="@+id/playback_song"
tools:text="Artist Name" />
<TextView
android:id="@+id/playback_album"
style="@style/Widget.Auxio.TextView.Secondary.Marquee"
android:layout_width="match_parent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:layout_marginEnd="@dimen/spacing_medium"
app:layout_constraintBottom_toTopOf="@+id/playback_seek_bar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="@+id/playback_song"
app:layout_constraintStart_toStartOf="@+id/playback_song"
tools:text="Album Name" />
@ -74,6 +75,17 @@
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent" />
<org.oxycblt.auxio.ui.RippleFixMaterialButton
android:id="@+id/playback_more"
style="@style/Widget.Auxio.Button.Icon.Small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:icon="@drawable/ic_more_24"
android:layout_marginEnd="@dimen/spacing_mid_medium"
app:layout_constraintBottom_toBottomOf="@+id/playback_album"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@+id/playback_song" />
<org.oxycblt.auxio.playback.ui.ForcedLTRFrameLayout
android:id="@+id/playback_controls_container"
android:layout_width="match_parent"

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

@ -12,6 +12,10 @@
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:menu="@menu/toolbar_playback"
app:titleCentered="true"
app:subtitleCentered="true"
app:titleTextAppearance="@style/TextAppearance.Auxio.TitleMediumEmphasis"
app:subtitleTextAppearance="@style/TextAppearance.Auxio.BodySmall"
app:navigationIcon="@drawable/ic_down_24"
app:title="@string/lbl_playback"
tools:subtitle="@string/lbl_all_songs" />
@ -33,9 +37,9 @@
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:layout_marginEnd="@dimen/spacing_medium"
android:layout_marginEnd="@dimen/spacing_mid_medium"
app:layout_constraintBottom_toTopOf="@+id/playback_artist"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintEnd_toStartOf="@+id/playback_more"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintVertical_chainStyle="packed"
tools:text="Song Name" />
@ -46,9 +50,8 @@
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:layout_marginEnd="@dimen/spacing_medium"
app:layout_constraintBottom_toTopOf="@+id/playback_album"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintEnd_toEndOf="@+id/playback_song"
app:layout_constraintStart_toStartOf="parent"
tools:text="Artist Name" />
@ -58,12 +61,22 @@
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:layout_marginEnd="@dimen/spacing_medium"
app:layout_constraintBottom_toTopOf="@+id/playback_seek_bar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintEnd_toEndOf="@+id/playback_song"
app:layout_constraintStart_toStartOf="parent"
tools:text="Album Name" />
<org.oxycblt.auxio.ui.RippleFixMaterialButton
android:id="@+id/playback_more"
style="@style/Widget.Auxio.Button.Icon.Small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:icon="@drawable/ic_more_24"
android:layout_marginEnd="@dimen/spacing_mid_medium"
app:layout_constraintBottom_toBottomOf="@+id/playback_album"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@+id/playback_song" />
<org.oxycblt.auxio.playback.ui.StyledSeekBar
android:id="@+id/playback_seek_bar"
android:layout_width="match_parent"
@ -104,7 +117,7 @@
<org.oxycblt.auxio.ui.RippleFixMaterialButton
android:id="@+id/playback_skip_prev"
style="@style/Widget.Auxio.Button.Icon.Large"
style="@style/Widget.Auxio.Button.Icon.Huge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="@dimen/spacing_huge"
@ -129,7 +142,7 @@
<org.oxycblt.auxio.ui.RippleFixMaterialButton
android:id="@+id/playback_skip_next"
style="@style/Widget.Auxio.Button.Icon.Large"
style="@style/Widget.Auxio.Button.Icon.Huge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_huge"

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

@ -12,6 +12,10 @@
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:menu="@menu/toolbar_playback"
app:titleCentered="true"
app:subtitleCentered="true"
app:titleTextAppearance="@style/TextAppearance.Auxio.TitleMediumEmphasis"
app:subtitleTextAppearance="@style/TextAppearance.Auxio.BodySmall"
app:navigationIcon="@drawable/ic_down_24"
app:title="@string/lbl_playback"
tools:subtitle="@string/lbl_all_songs" />
@ -35,10 +39,10 @@
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:layout_marginEnd="@dimen/spacing_medium"
android:orientation="vertical"
android:layout_marginEnd="@dimen/spacing_mid_medium"
app:layout_constraintBottom_toTopOf="@+id/playback_seek_bar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintEnd_toStartOf="@+id/playback_more"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/playback_cover"
app:layout_constraintTop_toTopOf="@+id/playback_cover"
@ -67,6 +71,17 @@
</LinearLayout>
<org.oxycblt.auxio.ui.RippleFixMaterialButton
android:id="@+id/playback_more"
style="@style/Widget.Auxio.Button.Icon.Small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:icon="@drawable/ic_more_24"
android:layout_marginEnd="@dimen/spacing_mid_medium"
app:layout_constraintBottom_toBottomOf="@+id/playback_info_container"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@+id/playback_info_container" />
<org.oxycblt.auxio.playback.ui.StyledSeekBar
android:id="@+id/playback_seek_bar"
android:layout_width="match_parent"

4
app/src/main/res/menu/toolbar_playback.xml
View file

@ -6,8 +6,4 @@
android:icon="@drawable/ic_config_24"
android:title="@string/lbl_equalizer"
app:showAsAction="always" />
<item
android:id="@+id/placeholder"
android:title=""
app:showAsAction="never" />
</menu>

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

@ -78,6 +78,14 @@
<item name="android:letterSpacing">-0.01125</item>
</style>
<style name="TextAppearance.Auxio.TitleMediumEmphasis" parent="TextAppearance.Material3.TitleMedium">
<item name="fontFamily">@font/inter_semibold</item>
<item name="android:fontFamily">@font/inter_semibold</item>
<item name="android:textStyle">bold</item>
<!-- TODO: Fix letter spacing here -->
<item name="android:letterSpacing">-0.01125</item>
</style>
<style name="TextAppearance.Auxio.TitleSmall" parent="TextAppearance.Material3.TitleSmall">
<item name="fontFamily">@font/inter_semibold</item>
<item name="android:fontFamily">@font/inter_semibold</item>