ui: minor tweaks

More miscellanious tweaks I can't categorize since I have no time.

It's mostly attempts at improving animation visuals an failing. Really
want to switch to material animations once I can finally get the things
working.
This commit is contained in:
Alexander Capehart 2022-12-05 21:13:31 -07:00
parent f5ec295b2c
commit cf64536118
No known key found for this signature in database
GPG key ID: 37DBE3621FE9AD47
13 changed files with 54 additions and 31 deletions

View file

@ -46,7 +46,7 @@ import org.oxycblt.auxio.util.systemBarInsetsCompat
*
* TODO: Use proper material attributes (Not the weird dimen attributes I currently have)
*
* TODO: Test out material animation system
* TODO: Migrate to material animation system
*
* @author OxygenCobalt
*/

View file

@ -28,7 +28,9 @@ import androidx.appcompat.widget.Toolbar
import androidx.coordinatorlayout.widget.CoordinatorLayout
import androidx.recyclerview.widget.LinearLayoutManager
import androidx.recyclerview.widget.RecyclerView
import androidx.transition.TransitionManager
import com.google.android.material.appbar.AppBarLayout
import com.google.android.material.transition.MaterialFade
import java.lang.reflect.Field
import org.oxycblt.auxio.R
import org.oxycblt.auxio.ui.AuxioAppBarLayout
@ -111,7 +113,11 @@ constructor(context: Context, attrs: AttributeSet? = null, @AttrRes defStyleAttr
this.titleAnimator =
ValueAnimator.ofFloat(from, to).apply {
addUpdateListener { titleView.alpha = it.animatedValue as Float }
duration = TOOLBAR_FADE_DURATION
duration = if (titleShown == true) {
context.resources.getInteger(R.integer.anim_fade_enter_duration).toLong()
} else {
context.resources.getInteger(R.integer.anim_fade_exit_duration).toLong()
}
start()
}
}
@ -142,8 +148,6 @@ constructor(context: Context, attrs: AttributeSet? = null, @AttrRes defStyleAttr
}
companion object {
private const val TOOLBAR_FADE_DURATION = 150L
private val TOOLBAR_TITLE_TEXT_FIELD: Field by
lazyReflectedField(Toolbar::class, "mTitleTextView")
}

View file

@ -161,10 +161,10 @@ constructor(context: Context, attrs: AttributeSet? = null, @AttrRes defStyleAttr
if (isActivated) {
targetVis = VISIBLE
targetDuration = 150L
targetDuration = context.resources.getInteger(R.integer.anim_fade_enter_duration).toLong()
} else {
targetVis = INVISIBLE
targetDuration = 84L
targetDuration = context.resources.getInteger(R.integer.anim_fade_exit_duration).toLong()
}
if (selectionIndicator.visibility == targetVis) {

View file

@ -21,6 +21,7 @@ import android.animation.ValueAnimator
import android.content.Context
import android.util.AttributeSet
import com.google.android.material.button.MaterialButton
import org.oxycblt.auxio.R
/**
* A [MaterialButton] that automatically morphs from a circle to a squircle shape appearance when it
@ -46,7 +47,7 @@ constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
animator?.cancel()
animator =
ValueAnimator.ofFloat(currentCornerRadiusRatio, target).apply {
duration = ACTIVATION_DURATION
duration = context.resources.getInteger(R.integer.anim_fade_enter_duration).toLong()
addUpdateListener { updateCornerRadiusRatio(animatedValue as Float) }
start()
}
@ -56,8 +57,4 @@ constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
currentCornerRadiusRatio = ratio
shapeAppearanceModel = shapeAppearanceModel.withCornerSize { it.width() * ratio }
}
companion object {
const val ACTIVATION_DURATION = 150L
}
}

View file

@ -70,7 +70,7 @@ constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
// Sanity check 2: Ensure that this value is within the duration and will not crash
// the app, and that the user is not currently seeking (which would cause the SeekBar
// to jump around).
if (from <= durationDs && !isSelected) {
if (from <= durationDs && !isActivated) {
binding.seekBarSlider.value = from.toFloat()
// We would want to keep this in the callback, but the callback only fires when
@ -106,13 +106,13 @@ constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
logD("Starting seek mode")
// User has begun seeking, place the SeekBar into a "Suspended" mode in which no
// position updates are sent and is indicated by the position value turning accented.
isSelected = true
isActivated = true
}
override fun onStopTrackingTouch(slider: Slider) {
logD("Confirming seek")
// End of seek event, send off new value to callback.
isSelected = false
isActivated = false
callback?.seekTo(slider.value.toLong())
}

View file

@ -33,13 +33,17 @@ import androidx.core.view.isInvisible
import androidx.recyclerview.widget.GridLayoutManager
import androidx.recyclerview.widget.LinearLayoutManager
import androidx.recyclerview.widget.RecyclerView
import androidx.transition.TransitionManager
import com.google.android.material.transition.MaterialFade
import kotlin.math.abs
import org.oxycblt.auxio.R
import org.oxycblt.auxio.ui.recycler.AuxioRecyclerView
import org.oxycblt.auxio.util.getDimen
import org.oxycblt.auxio.util.getDimenSize
import org.oxycblt.auxio.util.getDrawableCompat
import org.oxycblt.auxio.util.isRtl
import org.oxycblt.auxio.util.isUnder
import org.oxycblt.auxio.util.logD
import org.oxycblt.auxio.util.systemBarInsetsCompat
/**
@ -431,7 +435,7 @@ constructor(context: Context, attrs: AttributeSet? = null, @AttrRes defStyleAttr
}
showingThumb = true
animateView(thumbView, 1f)
animateViewIn(thumbView)
}
private fun hideScrollbar() {
@ -440,7 +444,7 @@ constructor(context: Context, attrs: AttributeSet? = null, @AttrRes defStyleAttr
}
showingThumb = false
animateView(thumbView, 0f)
animateViewOut(thumbView)
}
private fun showPopup() {
@ -449,7 +453,7 @@ constructor(context: Context, attrs: AttributeSet? = null, @AttrRes defStyleAttr
}
showingPopup = true
animateView(popupView, 1f)
animateViewIn(popupView)
}
private fun hidePopup() {
@ -458,11 +462,22 @@ constructor(context: Context, attrs: AttributeSet? = null, @AttrRes defStyleAttr
}
showingPopup = false
animateView(popupView, 0f)
animateViewOut(popupView)
}
private fun animateView(view: View, alpha: Float) {
view.animate().alpha(alpha).setDuration(ANIM_MILLIS).start()
private fun animateViewIn(view: View) {
logD(view.translationX)
view.animate()
.alpha(1f)
.setDuration(context.resources.getInteger(R.integer.anim_fade_enter_duration).toLong())
.start()
}
private fun animateViewOut(view: View) {
view.animate()
.alpha(0f)
.setDuration(context.resources.getInteger(R.integer.anim_fade_exit_duration).toLong())
.start()
}
// --- LAYOUT STATE ---

View file

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="?attr/colorPrimary" android:state_activated="true" />
<item android:color="?android:attr/textColorSecondary" />
</selector>

View file

@ -1,6 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="?android:attr/textColorSecondary" android:state_selected="true" />
<item android:alpha="0.5" android:color="?android:attr/textColorSecondary" android:state_enabled="false" />
<item android:color="?android:attr/textColorSecondary" />
</selector>

View file

@ -1,7 +1,7 @@
<?xml version="1.0" encoding="utf-8"?>
<animated-selector xmlns:android="http://schemas.android.com/apk/res/android"
android:enterFadeDuration="150"
android:exitFadeDuration="150">
android:enterFadeDuration="@integer/anim_fade_enter_duration"
android:exitFadeDuration="@integer/anim_fade_exit_duration">
<item
android:id="@+id/pressed"

View file

@ -51,7 +51,7 @@
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_mid_medium"
android:layout_marginTop="@dimen/spacing_medium"
android:hint="@string/lbl_relative_path"
app:expandedHintEnabled="false">
@ -67,7 +67,7 @@
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_mid_medium"
android:layout_marginTop="@dimen/spacing_medium"
android:hint="@string/lbl_format"
app:expandedHintEnabled="false">
@ -83,7 +83,7 @@
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_mid_medium"
android:layout_marginTop="@dimen/spacing_medium"
android:hint="@string/lbl_size"
app:expandedHintEnabled="false">
@ -99,7 +99,7 @@
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_mid_medium"
android:layout_marginTop="@dimen/spacing_medium"
android:hint="@string/lbl_sort_duration"
app:expandedHintEnabled="false">
@ -115,7 +115,7 @@
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_mid_medium"
android:layout_marginTop="@dimen/spacing_medium"
android:hint="@string/lbl_bitrate"
app:expandedHintEnabled="false">
@ -131,7 +131,7 @@
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_mid_medium"
android:layout_marginTop="@dimen/spacing_medium"
android:hint="@string/lbl_sample_rate"
app:expandedHintEnabled="false">

View file

@ -20,7 +20,7 @@
android:layout_marginStart="@dimen/spacing_medium"
android:layout_marginBottom="@dimen/spacing_tiny"
android:textAppearance="@style/TextAppearance.Auxio.BodySmall"
android:textColor="@color/sel_selectable_text_secondary"
android:textColor="@color/sel_activatable_text_secondary"
tools:text="11:38" />
<TextView

View file

@ -6,6 +6,9 @@
<item name="home_artist_list" type="id" />
<item name="home_genre_list" type="id" />
<integer name="anim_fade_enter_duration">150</integer>
<integer name="anim_fade_exit_duration">84</integer>
<declare-styleable name="StyledImageView">
<attr name="cornerRadius" format="dimension" />
<attr name="staticIcon" format="reference" />

View file

@ -149,7 +149,7 @@
<string name="lng_indexing">Loading your music library…</string>
<string name="lng_observing">Monitoring your music library for changes…</string>
<string name="lng_queue_added">Added to queue</string>
<string name="lng_author">Developed by OxygenCobalt</string>
<string name="lng_author">Developed by Alexander Capehart</string>
<!-- As in music library -->
<string name="lng_search_library">Search your library…</string>