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

playback: update tablet layouts

Browse source 
Use proper exact-size layouts for the tablet views. This also adds a
new compact view that shows more controls for landscape/tablet layouts.
This commit is contained in:
OxygenCobalt 2021-11-20 10:44:40 -07:00
parent 58c2681f72
commit 4475d4a5cc
No known key found for this signature in database
GPG key ID: 37DBE3621FE9AD47
8 changed files with 152 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
app/src/main/java/org/oxycblt/auxio/MainFragment.kt
View file

@ -142,10 +142,6 @@ class MainFragment : Fragment(), PlaybackBarLayout.ActionCallback {
return binding.root return binding.root
} }
override fun onPlayPauseClick() {
playbackModel.invertPlayingStatus()
}
override fun onNavToPlayback() { override fun onNavToPlayback() {
findNavController().navigate( findNavController().navigate(
MainFragmentDirections.actionGoToPlayback() MainFragmentDirections.actionGoToPlayback()
@ -155,4 +151,16 @@ class MainFragment : Fragment(), PlaybackBarLayout.ActionCallback {
override fun onNavToItem() { override fun onNavToItem() {
detailModel.navToItem(playbackModel.song.value ?: return) detailModel.navToItem(playbackModel.song.value ?: return)
} }
override fun onPrev() {
playbackModel.skipPrev()
}
override fun onPlayPauseClick() {
playbackModel.invertPlayingStatus()
}
override fun onNext() {
playbackModel.skipNext()
}
} }

2
app/src/main/java/org/oxycblt/auxio/playback/PlaybackBarLayout.kt
View file

@ -352,7 +352,9 @@ class PlaybackBarLayout @JvmOverloads constructor(
* view is detached. * view is detached.
*/ */
interface ActionCallback { interface ActionCallback {
fun onPrev()
fun onPlayPauseClick() fun onPlayPauseClick()
fun onNext()
fun onNavToItem() fun onNavToItem()
fun onNavToPlayback() fun onNavToPlayback()
} }

6
app/src/main/java/org/oxycblt/auxio/playback/PlaybackBarView.kt
View file

@ -81,10 +81,6 @@ class PlaybackBarView @JvmOverloads constructor(
true true
} }
binding.playbackPlayPause.setOnClickListener {
mCallback?.onPlayPauseClick()
}
// Deliberately override the progress bar color [in a Lollipop-friendly way] so that // Deliberately override the progress bar color [in a Lollipop-friendly way] so that
// we use colorSecondary instead of colorSurfaceVariant. This is for two reasons: // we use colorSecondary instead of colorSurfaceVariant. This is for two reasons:
// 1. colorSurfaceVariant is used with the assumption that the view that is using it // 1. colorSurfaceVariant is used with the assumption that the view that is using it
@ -115,9 +111,11 @@ class PlaybackBarView @JvmOverloads constructor(
fun setCallback(callback: PlaybackBarLayout.ActionCallback) { fun setCallback(callback: PlaybackBarLayout.ActionCallback) {
mCallback = callback mCallback = callback
binding.callback = callback
} }
fun clearCallback() { fun clearCallback() {
mCallback = null mCallback = null
binding.callback = null
} }
} }

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

@ -38,7 +38,7 @@
<ImageView <ImageView
android:id="@+id/playback_cover" android:id="@+id/playback_cover"
style="@style/Widget.Auxio.Image.Full" style="@style/Widget.Auxio.Image.Full"
android:layout_margin="@dimen/spacing_large" android:layout_margin="@dimen/spacing_mid_large"
android:contentDescription="@{@string/desc_album_cover(song.name)}" android:contentDescription="@{@string/desc_album_cover(song.name)}"
app:albumArt="@{song}" app:albumArt="@{song}"
app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintBottom_toBottomOf="parent"

4
app/src/main/res/layout-xlarge-land/fragment_playback.xml → app/src/main/res/layout-sw600dp-land/fragment_playback.xml
View file

@ -38,9 +38,7 @@
<ImageView <ImageView
android:id="@+id/playback_cover" android:id="@+id/playback_cover"
style="@style/Widget.Auxio.Image.Full" style="@style/Widget.Auxio.Image.Full"
android:layout_marginStart="@dimen/spacing_large" android:layout_margin="@dimen/spacing_mid_large"
android:layout_marginTop="@dimen/spacing_insane"
android:layout_marginBottom="@dimen/spacing_insane"
android:contentDescription="@{@string/desc_album_cover(song.name)}" android:contentDescription="@{@string/desc_album_cover(song.name)}"
app:albumArt="@{song}" app:albumArt="@{song}"
app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintBottom_toBottomOf="parent"

18
app/src/main/res/layout-xlarge/fragment_playback.xml → app/src/main/res/layout-sw600dp/fragment_playback.xml
View file

@ -38,7 +38,7 @@
<ImageView <ImageView
android:id="@+id/playback_cover" android:id="@+id/playback_cover"
style="@style/Widget.Auxio.Image.Full" style="@style/Widget.Auxio.Image.Full"
android:layout_margin="@dimen/spacing_huge" android:layout_margin="@dimen/spacing_mid_large"
android:contentDescription="@{@string/desc_album_cover(song.name)}" android:contentDescription="@{@string/desc_album_cover(song.name)}"
app:albumArt="@{song}" app:albumArt="@{song}"
app:layout_constraintBottom_toTopOf="@+id/playback_song" app:layout_constraintBottom_toTopOf="@+id/playback_song"
@ -53,8 +53,8 @@
style="@style/Widget.Auxio.TextView.Primary" style="@style/Widget.Auxio.TextView.Primary"
android:layout_width="0dp" android:layout_width="0dp"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_huge" android:layout_marginStart="@dimen/spacing_mid_large"
android:layout_marginEnd="@dimen/spacing_huge" android:layout_marginEnd="@dimen/spacing_mid_large"
android:onClick="@{() -> detailModel.navToItem(playbackModel.song)}" android:onClick="@{() -> detailModel.navToItem(playbackModel.song)}"
android:text="@{song.name}" android:text="@{song.name}"
app:layout_constraintBottom_toTopOf="@+id/playback_artist" app:layout_constraintBottom_toTopOf="@+id/playback_artist"
@ -68,8 +68,8 @@
style="@style/Widget.Auxio.TextView.Secondary" style="@style/Widget.Auxio.TextView.Secondary"
android:layout_width="0dp" android:layout_width="0dp"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_huge" android:layout_marginStart="@dimen/spacing_mid_large"
android:layout_marginEnd="@dimen/spacing_huge" android:layout_marginEnd="@dimen/spacing_mid_large"
android:onClick="@{() -> detailModel.navToItem(playbackModel.song.album.artist)}" android:onClick="@{() -> detailModel.navToItem(playbackModel.song.album.artist)}"
android:text="@{song.album.artist.resolvedName}" android:text="@{song.album.artist.resolvedName}"
app:layout_constraintBottom_toTopOf="@+id/playback_album" app:layout_constraintBottom_toTopOf="@+id/playback_album"
@ -82,8 +82,8 @@
style="@style/Widget.Auxio.TextView.Secondary" style="@style/Widget.Auxio.TextView.Secondary"
android:layout_width="0dp" android:layout_width="0dp"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_huge" android:layout_marginStart="@dimen/spacing_mid_large"
android:layout_marginEnd="@dimen/spacing_huge" android:layout_marginEnd="@dimen/spacing_mid_large"
android:onClick="@{() -> detailModel.navToItem(playbackModel.song.album)}" android:onClick="@{() -> detailModel.navToItem(playbackModel.song.album)}"
android:text="@{song.album.name}" android:text="@{song.album.name}"
app:layout_constraintBottom_toTopOf="@+id/playback_seek_bar" app:layout_constraintBottom_toTopOf="@+id/playback_seek_bar"
@ -95,8 +95,8 @@
android:id="@+id/playback_seek_bar" android:id="@+id/playback_seek_bar"
android:layout_width="0dp" android:layout_width="0dp"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_large" android:layout_marginStart="@dimen/spacing_small"
android:layout_marginEnd="@dimen/spacing_large" android:layout_marginEnd="@dimen/spacing_small"
app:layout_constraintBottom_toTopOf="@+id/playback_play_pause" app:layout_constraintBottom_toTopOf="@+id/playback_play_pause"
app:layout_constraintEnd_toEndOf="parent" app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" /> app:layout_constraintStart_toStartOf="parent" />

120
app/src/main/res/layout-w600dp/view_compact_playback.xml Normal file
View file

@ -0,0 +1,120 @@
<?xml version="1.0" encoding="utf-8"?>
<layout 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"
tools:context=".playback.PlaybackBarView">
<data>
<variable
name="song"
type="org.oxycblt.auxio.music.Song" />
<variable
name="callback"
type="org.oxycblt.auxio.playback.PlaybackBarLayout.ActionCallback" />
</data>
<merge
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:parentTag="androidx.constraintlayout.widget.ConstraintLayout">
<ImageView
android:id="@+id/playback_cover"
style="@style/Widget.Auxio.Image.Compact"
android:layout_margin="@dimen/spacing_small"
android:contentDescription="@{@string/desc_album_cover(song.name)}"
app:albumArt="@{song}"
app:layout_constraintBottom_toTopOf="@+id/playback_progress_bar"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:src="@drawable/ic_album" />
<TextView
android:id="@+id/playback_song"
style="@style/Widget.Auxio.TextView.Primary.Compact"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_small"
android:text="@{song.name}"
android:layout_marginEnd="@dimen/spacing_small"
app:layout_constraintBottom_toTopOf="@+id/playback_info"
app:layout_constraintEnd_toStartOf="@+id/playback_skip_prev"
app:layout_constraintStart_toEndOf="@+id/playback_cover"
app:layout_constraintTop_toTopOf="@+id/playback_cover"
app:layout_constraintVertical_chainStyle="packed"
tools:text="Song Name" />
<TextView
android:id="@+id/playback_info"
style="@style/Widget.Auxio.TextView.Secondary.Compact"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_small"
android:ellipsize="end"
android:text="@{@string/fmt_two(song.album.artist.resolvedName, song.album.name)}"
app:layout_constraintBottom_toBottomOf="@+id/playback_cover"
app:layout_constraintEnd_toEndOf="@+id/playback_song"
app:layout_constraintStart_toEndOf="@+id/playback_cover"
app:layout_constraintTop_toBottomOf="@+id/playback_song"
tools:text="Artist Name / Album Name" />
<ImageButton
android:id="@+id/playback_skip_prev"
style="@style/Widget.Auxio.Button.Unbounded"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/spacing_small"
android:contentDescription="@string/desc_play_pause"
android:src="@drawable/ic_skip_prev"
android:onClick="@{() -> callback.onPrev()}"
app:layout_constraintBottom_toBottomOf="@+id/playback_play_pause"
app:layout_constraintEnd_toStartOf="@+id/playback_play_pause"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/playback_song"
app:layout_constraintTop_toTopOf="@+id/playback_play_pause" />
<ImageButton
android:id="@+id/playback_play_pause"
style="@style/Widget.Auxio.Button.Unbounded"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/spacing_small"
android:contentDescription="@string/desc_play_pause"
android:src="@drawable/sel_playing_state"
android:onClick="@{() -> callback.onPlayPauseClick()}"
app:layout_constraintBottom_toTopOf="@+id/playback_progress_bar"
app:layout_constraintEnd_toStartOf="@+id/playback_skip_next"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/playback_skip_prev"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="@+id/playback_skip_next"
style="@style/Widget.Auxio.Button.Unbounded"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/spacing_small"
android:contentDescription="@string/desc_play_pause"
android:src="@drawable/ic_skip_next"
android:onClick="@{() -> callback.onNext()}"
app:layout_constraintBottom_toBottomOf="@+id/playback_play_pause"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/playback_play_pause"
app:layout_constraintTop_toTopOf="@+id/playback_play_pause" />
<com.google.android.material.progressindicator.LinearProgressIndicator
android:id="@+id/playback_progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="@{(int) song.seconds}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:trackColor="?attr/colorPrimary"
tools:progress="70" />
</merge>
</layout>

5
app/src/main/res/layout/view_compact_playback.xml
View file

@ -10,6 +10,10 @@
name="song" name="song"
type="org.oxycblt.auxio.music.Song" /> type="org.oxycblt.auxio.music.Song" />
<variable
name="callback"
type="org.oxycblt.auxio.playback.PlaybackBarLayout.ActionCallback" />
</data> </data>
<merge <merge
@ -66,6 +70,7 @@
android:layout_margin="@dimen/spacing_small" android:layout_margin="@dimen/spacing_small"
android:contentDescription="@string/desc_play_pause" android:contentDescription="@string/desc_play_pause"
android:src="@drawable/sel_playing_state" android:src="@drawable/sel_playing_state"
android:onClick="@{() -> callback.onPlayPauseClick()}"
app:layout_constraintBottom_toTopOf="@+id/playback_progress_bar" app:layout_constraintBottom_toTopOf="@+id/playback_progress_bar"
app:layout_constraintEnd_toEndOf="parent" app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" /> app:layout_constraintTop_toTopOf="parent" />