Fix issue where seams should show up on play icon

Fix a bug where a seam would display on the play icon on certain displays.
This commit is contained in:
OxygenCobalt 2021-02-16 20:31:37 -07:00
parent 1d8aeb16c2
commit 2203018947
No known key found for this signature in database
GPG key ID: 37DBE3621FE9AD47
26 changed files with 138 additions and 109 deletions

View file

@ -26,7 +26,6 @@
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
@ -37,7 +36,6 @@
android:exported="false"
android:foregroundServiceType="mediaPlayback"
android:icon="@mipmap/ic_launcher"
android:roundIcon="@mipmap/ic_launcher_round"
android:stopWithTask="false" />
android:roundIcon="@mipmap/ic_launcher_round" />
</application>
</manifest>

View file

@ -150,11 +150,11 @@ class MainFragment : Fragment() {
if (song == null) {
logD("Hiding CompactPlaybackFragment since no song is being played.")
if (isLandscape(resources)) {
binding.compactPlayback.visibility = View.INVISIBLE
} else {
binding.compactPlayback.visibility = View.GONE
}
binding.compactPlayback.visibility =
if (isLandscape(resources))
View.INVISIBLE
else
View.GONE
playbackModel.disableAnimation()
} else {

View file

@ -51,7 +51,8 @@ fun ImageView.bindGenreImage(genre: Genre) {
}
/**
* Custom extension function similar to the stock coil load extensions, but allows for any type.
* Custom extension function similar to the stock coil load extensions, but handles whether
* to even show images and custom fetchers.
*/
inline fun <reified T : Any> ImageView.load(
data: T,
@ -101,4 +102,4 @@ fun loadBitmap(context: Context, song: Song, onDone: (Bitmap?) -> Unit) {
)
.build()
)
}
}

View file

@ -55,7 +55,7 @@ data class Song(
/**
* Apply a genre to a song.
* @throws IllegalArgumentException When a genre is already applied.
* @throws IllegalStateException When a genre is already applied.
*/
fun applyGenre(genre: Genre) {
check(mGenre == null) { "Genre is already applied" }
@ -65,7 +65,7 @@ data class Song(
/**
* Apply an album to a song.
* @throws IllegalArgumentException When an album is already applied.
* @throws IllegalStateException When an album is already applied.
*/
fun applyAlbum(album: Album) {
check(mAlbum == null) { "Album is already applied" }

View file

@ -1,16 +1,13 @@
package org.oxycblt.auxio.playback
import android.graphics.drawable.AnimatedVectorDrawable
import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.core.content.ContextCompat
import androidx.fragment.app.Fragment
import androidx.fragment.app.activityViewModels
import androidx.navigation.fragment.findNavController
import org.oxycblt.auxio.MainFragmentDirections
import org.oxycblt.auxio.R
import org.oxycblt.auxio.databinding.FragmentCompactPlaybackBinding
import org.oxycblt.auxio.detail.DetailViewModel
import org.oxycblt.auxio.logD
@ -77,33 +74,15 @@ class CompactPlaybackFragment : Fragment() {
override fun onResume() {
super.onResume()
playbackModel.disableAnimation()
val iconPauseToPlay = ContextCompat.getDrawable(
requireContext(), R.drawable.ic_pause_to_play
) as AnimatedVectorDrawable
val iconPlayToPause = ContextCompat.getDrawable(
requireContext(), R.drawable.ic_play_to_pause
) as AnimatedVectorDrawable
playbackModel.isPlaying.observe(viewLifecycleOwner) {
if (playbackModel.canAnimate) {
if (it) {
// Animate the icon transition when the playing status switches
binding.playbackControls.setImageDrawable(iconPlayToPause)
iconPlayToPause.start()
} else {
binding.playbackControls.setImageDrawable(iconPauseToPlay)
iconPauseToPlay.start()
}
if (it) {
binding.playbackPlayPause.showPause(playbackModel.canAnimate)
playbackModel.enableAnimation()
} else {
// Use static icons on the first firing of this observer so that the icons
// don't animate on startup, which looks weird.
binding.playbackControls.setImageResource(
if (it) R.drawable.ic_pause_large else R.drawable.ic_play_large
)
binding.playbackPlayPause.showPlay(playbackModel.canAnimate)
playbackModel.enableAnimation()
}
}

View file

@ -0,0 +1,62 @@
package org.oxycblt.auxio.playback
import android.content.Context
import android.graphics.drawable.Animatable2
import android.graphics.drawable.Drawable
import android.os.Build
import android.util.AttributeSet
import androidx.annotation.RequiresApi
import androidx.appcompat.widget.AppCompatImageButton
import org.oxycblt.auxio.R
import org.oxycblt.auxio.ui.getAnimatedDrawable
/**
* Custom [AppCompatImageButton] that handles the animated play/pause icons.
*/
class PlayPauseButton @JvmOverloads constructor(
context: Context,
attrs: AttributeSet? = null,
defStyleAttr: Int = -1
) : AppCompatImageButton(context, attrs, defStyleAttr) {
private val iconPauseToPlay = context.getAnimatedDrawable(R.drawable.ic_pause_to_play)
private val iconPlayToPause = context.getAnimatedDrawable(R.drawable.ic_play_to_pause)
init {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
fixSeams()
}
}
fun showPlay(animated: Boolean) {
if (animated) {
setImageDrawable(iconPauseToPlay)
iconPauseToPlay.start()
} else {
setImageResource(R.drawable.ic_play_large)
}
}
fun showPause(animated: Boolean) {
if (animated) {
setImageDrawable(iconPlayToPause)
iconPlayToPause.start()
} else {
setImageResource(R.drawable.ic_pause_large)
}
}
/**
* Hack that fixes an issue where a seam will display on the play button on certain display
* sizes due to floating point precision problems (Gotta love IEEE 754)
* This is done by detecting when the animation has ended and then reverting this
* view to the normal static image. Not possible below API 23 though.
*/
@RequiresApi(Build.VERSION_CODES.M)
private fun fixSeams() {
iconPauseToPlay.registerAnimationCallback(object : Animatable2.AnimationCallback() {
override fun onAnimationEnd(drawable: Drawable?) {
setImageResource(R.drawable.ic_play_large)
}
})
}
}

View file

@ -1,7 +1,6 @@
package org.oxycblt.auxio.playback
import android.content.res.ColorStateList
import android.graphics.drawable.AnimatedVectorDrawable
import android.os.Bundle
import android.view.LayoutInflater
import android.view.MenuItem
@ -187,41 +186,18 @@ class PlaybackFragment : Fragment(), SeekBar.OnSeekBarChangeListener {
override fun onResume() {
super.onResume()
playbackModel.disableAnimation()
val iconPauseToPlay = ContextCompat.getDrawable(
requireContext(), R.drawable.ic_pause_to_play
) as AnimatedVectorDrawable
val iconPlayToPause = ContextCompat.getDrawable(
requireContext(), R.drawable.ic_play_to_pause
) as AnimatedVectorDrawable
playbackModel.isPlaying.observe(viewLifecycleOwner) {
if (it) {
if (playbackModel.canAnimate) {
binding.playbackPlayPause.setImageDrawable(iconPlayToPause)
iconPlayToPause.start()
} else {
// Use a static icon the first time around to fix premature animation
// [Which looks weird]
binding.playbackPlayPause.setImageResource(R.drawable.ic_pause_large)
playbackModel.enableAnimation()
}
binding.playbackPlayPause.showPause(playbackModel.canAnimate)
binding.playbackPlayPause.backgroundTintList = accentColor
playbackModel.enableAnimation()
} else {
if (playbackModel.canAnimate) {
binding.playbackPlayPause.setImageDrawable(iconPauseToPlay)
iconPauseToPlay.start()
} else {
binding.playbackPlayPause.setImageResource(R.drawable.ic_play_large)
playbackModel.enableAnimation()
}
binding.playbackPlayPause.showPlay(playbackModel.canAnimate)
binding.playbackPlayPause.backgroundTintList = controlColor
playbackModel.enableAnimation()
}
}
}

View file

@ -6,6 +6,7 @@ import android.content.res.ColorStateList
import android.content.res.Configuration
import android.content.res.Resources
import android.graphics.Point
import android.graphics.drawable.AnimatedVectorDrawable
import android.os.Build
import android.text.Spanned
import android.util.DisplayMetrics
@ -17,6 +18,7 @@ import android.widget.TextView
import android.widget.Toast
import androidx.annotation.ColorInt
import androidx.annotation.ColorRes
import androidx.annotation.DrawableRes
import androidx.annotation.PluralsRes
import androidx.appcompat.app.AppCompatActivity
import androidx.core.content.ContextCompat
@ -78,6 +80,13 @@ fun Context.getPlural(@PluralsRes pluralsRes: Int, value: Int): String {
*/
val Context.inflater: LayoutInflater get() = LayoutInflater.from(this)
/**
* Shortcut to get an [AnimatedVectorDrawable] from a [Context]
*/
fun Context.getAnimatedDrawable(@DrawableRes drawableRes: Int): AnimatedVectorDrawable {
return ContextCompat.getDrawable(this, drawableRes) as AnimatedVectorDrawable
}
/**
* Create a [Toast] from a [String]
* @param context [Context] required to create the toast

View file

@ -11,15 +11,22 @@
android:pivotX="12"
android:pivotY="12">
<!--
Dupe the layout so that animations work WHILE preventing a seam from showing on the icon
due to floating point precision errors.
IEE 754 moment
-->
<path
android:name="play_upper"
android:fillColor="#FF000000"
android:pathData="M8.25,6L8.25,12L18.75,12L18.75,12Z" />
android:strokeColor="#00000000"
android:pathData="m 8.2501424,6.0001505 v 5.9996335 6.000151 L 18.749759,11.999784 Z" />
<path
android:name="play_lower"
android:fillColor="#FF000000"
android:pathData="M8.25,18L8.25,12L18.75,12L18.75,12Z" />
android:strokeColor="#00000000"
android:pathData="m 8.2501424,6.0001505 v 5.9996335 6.000151 L 18.749759,11.999784 Z" />
</group>

View file

@ -52,7 +52,7 @@
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.SmallHeader"
app:layout_constraintBottom_toTopOf="@+id/playback_info"
app:layout_constraintEnd_toStartOf="@+id/playback_controls"
app:layout_constraintEnd_toStartOf="@+id/playback_play_pause"
app:layout_constraintStart_toEndOf="@+id/playback_cover"
app:layout_constraintTop_toTopOf="@+id/playback_cover"
app:layout_constraintVertical_chainStyle="packed"
@ -70,13 +70,13 @@
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.MaterialComponents.Caption"
app:layout_constraintBottom_toBottomOf="@+id/playback_cover"
app:layout_constraintEnd_toStartOf="@+id/playback_controls"
app:layout_constraintEnd_toStartOf="@+id/playback_play_pause"
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_controls"
<org.oxycblt.auxio.playback.PlayPauseButton
android:id="@+id/playback_play_pause"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="@dimen/size_play_pause_compact"
android:layout_height="@dimen/size_play_pause_compact"
@ -88,7 +88,7 @@
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:src="@drawable/ic_play_to_pause" />
tools:src="@drawable/ic_pause_large" />
<ProgressBar
android:id="@+id/playback_progress"

View file

@ -184,7 +184,7 @@
app:layout_constraintStart_toEndOf="@+id/playback_loop"
app:layout_constraintTop_toTopOf="@+id/playback_play_pause" />
<ImageButton
<org.oxycblt.auxio.playback.PlayPauseButton
android:id="@+id/playback_play_pause"
style="@style/PlayPause"
android:contentDescription="@string/description_play_pause"
@ -193,7 +193,7 @@
app:layout_constraintEnd_toEndOf="@+id/playback_song_duration"
app:layout_constraintStart_toStartOf="@+id/playback_duration_current"
app:layout_constraintTop_toBottomOf="@+id/playback_duration_current"
tools:src="@drawable/ic_play_to_pause" />
tools:src="@drawable/ic_pause_large" />
<ImageButton
android:id="@+id/playback_skip_next"

View file

@ -58,7 +58,6 @@
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/margin_medium"
android:background="@drawable/ui_ripple"
android:clickable="true"
android:focusable="true"
android:onClick="@{() -> detailModel.navToItem(album.artist)}"
@ -92,7 +91,7 @@
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/album_cover"
tools:textColor="@color/blue" />
tools:textColor="@color/control_color" />
<com.google.android.material.button.MaterialButton
android:id="@+id/album_shuffle_button"
@ -103,7 +102,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/album_play_button"
app:layout_constraintTop_toTopOf="@+id/album_play_button"
tools:backgroundTint="@color/blue" />
tools:backgroundTint="@color/control_color" />
<TextView
android:id="@+id/album_song_header"

View file

@ -87,7 +87,7 @@
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/artist_image"
tools:textColor="@color/blue" />
tools:textColor="@color/control_color" />
<com.google.android.material.button.MaterialButton
android:id="@+id/artist_shuffle_button"
@ -98,7 +98,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/artist_play_button"
app:layout_constraintTop_toTopOf="@+id/artist_play_button"
tools:backgroundTint="@color/blue" />
tools:backgroundTint="@color/control_color" />
<TextView
android:id="@+id/artist_album_header"

View file

@ -74,7 +74,7 @@
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/genre_image"
tools:textColor="@color/blue" />
tools:textColor="@color/control_color" />
<com.google.android.material.button.MaterialButton
android:id="@+id/genre_shuffle_button"
@ -85,7 +85,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/genre_play_button"
app:layout_constraintTop_toTopOf="@+id/genre_play_button"
tools:backgroundTint="@color/blue" />
tools:backgroundTint="@color/control_color" />
<TextView
android:id="@+id/genre_duration"

View file

@ -58,7 +58,6 @@
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/margin_medium"
android:background="@drawable/ui_ripple"
android:clickable="true"
android:focusable="true"
android:onClick="@{() -> detailModel.navToItem(album.artist)}"
@ -92,7 +91,7 @@
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/album_cover"
tools:textColor="@color/blue" />
tools:textColor="@color/control_color" />
<com.google.android.material.button.MaterialButton
android:id="@+id/album_shuffle_button"
@ -103,7 +102,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/album_play_button"
app:layout_constraintTop_toTopOf="@+id/album_play_button"
tools:backgroundTint="@color/blue" />
tools:backgroundTint="@color/control_color" />
<TextView
android:id="@+id/album_song_header"

View file

@ -87,7 +87,7 @@
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/artist_image"
tools:textColor="@color/blue" />
tools:textColor="@color/control_color" />
<com.google.android.material.button.MaterialButton
android:id="@+id/artist_shuffle_button"
@ -98,7 +98,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/artist_play_button"
app:layout_constraintTop_toTopOf="@+id/artist_play_button"
tools:backgroundTint="@color/blue" />
tools:backgroundTint="@color/control_color" />
<TextView
android:id="@+id/artist_album_header"

View file

@ -74,7 +74,7 @@
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/genre_image"
tools:textColor="@color/blue" />
tools:textColor="@color/control_color" />
<com.google.android.material.button.MaterialButton
android:id="@+id/genre_shuffle_button"
@ -85,7 +85,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/genre_play_button"
app:layout_constraintTop_toTopOf="@+id/genre_play_button"
tools:backgroundTint="@color/blue" />
tools:backgroundTint="@color/control_color" />
<TextView
android:id="@+id/genre_duration"

View file

@ -185,7 +185,7 @@
app:layout_constraintEnd_toStartOf="@+id/playback_play_pause"
app:layout_constraintTop_toTopOf="@+id/playback_play_pause" />
<ImageButton
<org.oxycblt.auxio.playback.PlayPauseButton
android:id="@+id/playback_play_pause"
style="@style/PlayPause"
android:contentDescription="@string/description_play_pause"
@ -194,7 +194,7 @@
app:layout_constraintEnd_toEndOf="@+id/playback_song_container_duration"
app:layout_constraintStart_toStartOf="@+id/playback_duration_current"
app:layout_constraintTop_toBottomOf="@+id/playback_duration_current"
tools:src="@drawable/ic_play_to_pause" />
tools:src="@drawable/ic_pause_large" />
<ImageButton
android:id="@+id/playback_skip_next"

View file

@ -173,7 +173,7 @@
app:layout_constraintEnd_toStartOf="@+id/playback_play_pause"
app:layout_constraintTop_toTopOf="@+id/playback_play_pause" />
<ImageButton
<org.oxycblt.auxio.playback.PlayPauseButton
android:id="@+id/playback_play_pause"
style="@style/PlayPause"
android:layout_marginBottom="@dimen/margin_large"
@ -182,8 +182,7 @@
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="@+id/playback_song_duration"
app:layout_constraintStart_toStartOf="@+id/playback_duration_current"
tools:src="@drawable/ic_play_to_pause" />
tools:src="@drawable/ic_pause_large" />
<ImageButton
android:id="@+id/playback_skip_next"

View file

@ -61,7 +61,7 @@
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.SmallHeader"
app:layout_constraintBottom_toTopOf="@+id/playback_info"
app:layout_constraintEnd_toStartOf="@+id/playback_controls"
app:layout_constraintEnd_toStartOf="@+id/playback_play_pause"
app:layout_constraintStart_toEndOf="@+id/playback_cover"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="packed"
@ -79,13 +79,13 @@
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.MaterialComponents.Caption"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/playback_controls"
app:layout_constraintEnd_toStartOf="@+id/playback_play_pause"
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_controls"
<org.oxycblt.auxio.playback.PlayPauseButton
android:id="@+id/playback_play_pause"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="@dimen/size_play_pause_compact"
android:layout_height="@dimen/size_play_pause_compact"
@ -97,7 +97,7 @@
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:src="@drawable/ic_play_to_pause" />
tools:src="@drawable/ic_play_large" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>

View file

@ -171,7 +171,7 @@
app:layout_constraintStart_toEndOf="@+id/playback_loop"
app:layout_constraintTop_toTopOf="@+id/playback_play_pause" />
<ImageButton
<org.oxycblt.auxio.playback.PlayPauseButton
android:id="@+id/playback_play_pause"
style="@style/PlayPause"
android:layout_marginBottom="@dimen/margin_medium"
@ -180,7 +180,7 @@
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="@+id/playback_song_duration"
app:layout_constraintStart_toStartOf="@+id/playback_duration_current"
tools:src="@drawable/ic_play_to_pause" />
tools:src="@drawable/ic_pause_large" />
<ImageButton
android:id="@+id/playback_skip_next"

View file

@ -85,7 +85,7 @@
app:layout_constraintEnd_toStartOf="@+id/album_shuffle_button"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/album_details"
tools:textColor="@color/blue" />
tools:textColor="@color/control_color" />
<com.google.android.material.button.MaterialButton
android:id="@+id/album_shuffle_button"
@ -96,7 +96,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/album_play_button"
app:layout_constraintTop_toTopOf="@+id/album_play_button"
tools:backgroundTint="@color/blue" />
tools:backgroundTint="@color/control_color" />
<TextView
android:id="@+id/album_song_header"

View file

@ -84,7 +84,7 @@
app:layout_constraintEnd_toStartOf="@+id/artist_shuffle_button"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/artist_counts"
tools:textColor="@color/blue" />
tools:textColor="@color/control_color" />
<com.google.android.material.button.MaterialButton
android:id="@+id/artist_shuffle_button"
@ -95,7 +95,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/artist_play_button"
app:layout_constraintTop_toTopOf="@+id/artist_play_button"
tools:backgroundTint="@color/blue" />
tools:backgroundTint="@color/control_color" />
<TextView
android:id="@+id/artist_album_header"

View file

@ -85,7 +85,7 @@
app:layout_constraintEnd_toStartOf="@+id/genre_shuffle_button"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/genre_duration"
tools:textColor="@color/blue" />
tools:textColor="@color/control_color" />
<com.google.android.material.button.MaterialButton
android:id="@+id/genre_shuffle_button"
@ -96,7 +96,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/genre_play_button"
app:layout_constraintTop_toTopOf="@+id/genre_play_button"
tools:backgroundTint="@color/blue" />
tools:backgroundTint="@color/control_color" />
<TextView
android:id="@+id/genre_song_header"

View file

@ -100,7 +100,7 @@
<!-- Fast scroll theme -->
<style name="FastScrollTheme" parent="Widget.IndicatorFastScroll.FastScroller">
<item name="android:textColor">@color/ui_state_color</item>
<item name="android:textColor">@color/color_scroll_tints</item>
<item name="android:textAppearance">@style/TextAppearance.FastScroll</item>
</style>