Adding animation for 3 states of checkboxes in settings

since im stuck with illustrator we're back to using it
This commit is contained in:
Jays2Kings 2021-07-11 01:59:16 -04:00
parent e840e622df
commit b44e343466
7 changed files with 345 additions and 11 deletions

View File

@ -21,11 +21,11 @@ fun ImageView.setVectorCompat(@DrawableRes drawable: Int, @AttrRes tint: Int? =
setImageDrawable(vector)
}
fun ImageView.setAnimVectorCompat(@DrawableRes drawable: Int, tint: Int? = null) {
fun ImageView.setAnimVectorCompat(@DrawableRes drawable: Int, @AttrRes tint: Int? = null) {
val vector = AnimatedVectorDrawableCompat.create(context, drawable)
if (tint != null) {
vector?.mutate()
vector?.setTint(tint)
vector?.setTint(context.getResourceColor(tint))
}
setImageDrawable(vector)
vector?.start()

View File

@ -4,23 +4,36 @@ import android.content.Context
import android.util.AttributeSet
import androidx.appcompat.widget.AppCompatImageView
import eu.kanade.tachiyomi.R
import eu.kanade.tachiyomi.util.view.setAnimVectorCompat
import eu.kanade.tachiyomi.util.view.setVectorCompat
class QuadStateCheckBox @JvmOverloads constructor(context: Context, attrs: AttributeSet? = null) :
AppCompatImageView(context, attrs) {
var state: State = State.UNCHECKED
set(value) {
field = value
updateDrawable()
}
private fun updateDrawable() {
fun animateDrawableToState(state: State) {
when (state) {
State.UNCHECKED -> setAnimVectorCompat(
when (this.state) {
State.INVERSED -> R.drawable.anim_check_box_x_to_blank_24dp
else -> R.drawable.anim_checkbox_checked_to_blank_24dp
},
R.attr.colorControlNormal
)
State.INDETERMINATE -> setVectorCompat(R.drawable.ic_indeterminate_check_box_24dp, R.attr.colorAccent)
State.CHECKED -> setAnimVectorCompat(R.drawable.anim_check_box_blank_to_checked_24dp, R.attr.colorAccent)
State.INVERSED -> setAnimVectorCompat(R.drawable.anim_check_box_checked_to_x_24dp, R.attr.colorAccentText)
}
this.state = state
}
fun updateDrawable() {
when (state) {
State.UNCHECKED -> setVectorCompat(R.drawable.ic_check_box_outline_blank_24dp, R.attr.colorControlNormal)
State.INDETERMINATE -> setVectorCompat(R.drawable.ic_indeterminate_check_box_24dp, R.attr.colorAccent)
State.CHECKED -> setVectorCompat(R.drawable.ic_check_box_24dp, R.attr.colorAccent)
State.INVERSED -> setVectorCompat(R.drawable.ic_check_box_x_24dp, R.attr.colorAccent)
State.INVERSED -> setVectorCompat(R.drawable.ic_check_box_x_24dp, R.attr.colorAccentText)
}
}

View File

@ -95,6 +95,7 @@ internal class QuadStateMultiChoiceDialogAdapter(
holder.isEnabled = !disabledIndices.contains(position)
holder.controlView.state = states[currentSelection[position]]
holder.controlView.updateDrawable()
holder.titleView.text = items[position]
holder.itemView.background = dialog.getItemSelector()
@ -110,15 +111,15 @@ internal class QuadStateMultiChoiceDialogAdapter(
) {
when (payloads.firstOrNull()) {
CheckPayload -> {
holder.controlView.state = QuadStateCheckBox.State.CHECKED
holder.controlView.animateDrawableToState(QuadStateCheckBox.State.CHECKED)
return
}
InverseCheckPayload -> {
holder.controlView.state = QuadStateCheckBox.State.INVERSED
holder.controlView.animateDrawableToState(QuadStateCheckBox.State.INVERSED)
return
}
UncheckPayload -> {
holder.controlView.state = QuadStateCheckBox.State.UNCHECKED
holder.controlView.animateDrawableToState(QuadStateCheckBox.State.UNCHECKED)
return
}
}

View File

@ -0,0 +1,80 @@
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
android:name="vector"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<group
android:name="group"
android:pivotX="12"
android:pivotY="12">
<path
android:name="path"
android:pathData="M 19 3 L 5 3 C 3.89 3 3 3.89 3 5 L 3 19 C 3 19.53 3.211 20.039 3.586 20.414 C 3.961 20.789 4.47 21 5 21 L 19 21 C 19.53 21 20.039 20.789 20.414 20.414 C 20.789 20.039 21 19.53 21 19 L 21 5 C 21 3.89 20.1 3 19 3 M 19 5 L 19 19 L 5 19 L 5 5 L 19 5 Z"
android:fillColor="#000"
android:strokeWidth="1"/>
</group>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="150"
android:valueFrom="M 19 3 L 5 3 C 3.89 3 3 3.89 3 5 L 3 19 C 3 19.53 3.211 20.039 3.586 20.414 C 3.961 20.789 4.47 21 5 21 L 19 21 C 19.53 21 20.039 20.789 20.414 20.414 C 20.789 20.039 21 19.53 21 19 L 21 5 C 21 3.89 20.1 3 19 3 M 19 5 L 19 19 L 5 19 L 5 5 L 19 5 Z"
android:valueTo="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 19.559 3.232 20.066 3.605 20.43 C 3.966 20.782 4.459 21 5 21 L 19 21 C 19.507 21 19.971 20.809 20.324 20.496 C 20.738 20.128 21 19.593 21 19 L 21 5 C 21 3.9 20.1 3 19 3 M 12.7 11.3 L 12.7 12.7 L 11.3 12.7 L 11.3 11.3 L 12.7 11.3 Z"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="150"
android:duration="150"
android:valueFrom="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.913 20.122 3.022 19.04 3 C 19.027 3 19.013 3 19 3 M 12.7 12.7 L 11.3 12.7 L 11.3 11.3 L 12.7 11.3 L 12.7 11.3 L 12.7 12.7"
android:valueTo="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.9 20.1 3 19 3 C 19 3 19 3 19 3 M 10 17 L 5 12 L 6.4 10.6 L 10 14.2 L 17.6 6.6 L 19 8"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
<target android:name="group">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="scaleX"
android:duration="150"
android:valueFrom="1"
android:valueTo="0.9"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleY"
android:duration="150"
android:valueFrom="1"
android:valueTo="0.9"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleX"
android:startOffset="150"
android:duration="150"
android:valueFrom="0.9"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleY"
android:startOffset="150"
android:duration="150"
android:valueFrom="0.9"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
</animated-vector>

View File

@ -0,0 +1,80 @@
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
android:name="vector"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<group
android:name="group"
android:pivotX="12"
android:pivotY="12">
<path
android:name="path"
android:pathData="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.9 20.1 3 19 3 C 19 3 19 3 19 3 M 10 17 L 5 12 L 6.4 10.6 L 10 14.2 L 17.6 6.6 L 19 8"
android:fillColor="#000"
android:strokeWidth="1"/>
</group>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="150"
android:valueFrom="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.9 20.1 3 19 3 C 19 3 19 3 19 3 M 10 17 L 5 12 L 6.4 10.6 L 10 14.2 L 17.6 6.6 L 19 8"
android:valueTo="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.913 20.122 3.022 19.04 3 C 19.027 3 19.013 3 19 3 M 12.7 12.7 L 11.3 12.7 L 11.3 11.3 L 12.7 11.3 L 12.7 11.3 L 12.7 12.7"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="150"
android:duration="150"
android:valueFrom="M 19.04 3 C 19.027 3 19.013 3 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.913 20.122 3.022 19.04 3 M 12.654 12.7 L 12.031 12.7 L 11.3 12.7 L 11.3 12.7 L 11.3 12 L 11.3 11.3 L 11.331 11.3 L 12.031 11.3 L 12.7 11.3 L 12.7 11.3 L 12.7 12.078 L 12.7 12.7 L 12.7 12.7 L 12.654 12.7"
android:valueTo="M 19 3 C 18.991 3 18.982 3 18.973 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.9 20.1 3 19 3 M 15.6 17 L 12 13.4 L 8.4 17 L 7 15.6 L 10.6 12 L 7 8.4 L 8.4 7 L 12 10.6 L 15.6 7 L 17 8.4 L 13.4 12 L 17 15.6 L 15.6 17 L 15.6 17"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
<target android:name="group">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="scaleX"
android:duration="150"
android:valueFrom="1"
android:valueTo="0.9"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleY"
android:duration="150"
android:valueFrom="1"
android:valueTo="0.9"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleX"
android:startOffset="150"
android:duration="150"
android:valueFrom="0.9"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleY"
android:startOffset="150"
android:duration="150"
android:valueFrom="0.9"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
</animated-vector>

View File

@ -0,0 +1,80 @@
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
android:name="vector"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<group
android:name="group"
android:pivotX="12"
android:pivotY="12">
<path
android:name="path"
android:pathData="M 19 3 C 18.991 3 18.982 3 18.973 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.9 20.1 3 19 3 M 15.6 17 L 12 13.4 L 8.4 17 L 7 15.6 L 10.6 12 L 7 8.4 L 8.4 7 L 12 10.6 L 15.6 7 L 17 8.4 L 13.4 12 L 17 15.6 L 15.6 17 L 15.6 17"
android:fillColor="#000"
android:strokeWidth="1"/>
</group>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="150"
android:valueFrom="M 19 3 C 18.991 3 18.982 3 18.973 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.9 20.1 3 19 3 M 15.6 17 L 12 13.4 L 8.4 17 L 7 15.6 L 10.6 12 L 7 8.4 L 8.4 7 L 12 10.6 L 15.6 7 L 17 8.4 L 13.4 12 L 17 15.6 L 15.6 17 L 15.6 17"
android:valueTo="M 19.04 3 C 19.027 3 19.013 3 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.913 20.122 3.022 19.04 3 M 12.654 12.7 L 12.031 12.7 L 11.3 12.7 L 11.3 12.7 L 11.3 12 L 11.3 11.3 L 11.331 11.3 L 12.031 11.3 L 12.7 11.3 L 12.7 11.3 L 12.7 12.078 L 12.7 12.7 L 12.7 12.7 L 12.654 12.7"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="150"
android:duration="150"
android:valueFrom="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 19.559 3.232 20.066 3.605 20.43 C 3.966 20.782 4.459 21 5 21 L 19 21 C 19.507 21 19.971 20.809 20.324 20.496 C 20.738 20.128 21 19.593 21 19 L 21 5 C 21 3.9 20.1 3 19 3 M 12.7 11.3 L 12.7 12.7 L 11.3 12.7 L 11.3 11.3 L 12.7 11.3 Z"
android:valueTo="M 19 3 L 5 3 C 3.89 3 3 3.89 3 5 L 3 19 C 3 19.53 3.211 20.039 3.586 20.414 C 3.961 20.789 4.47 21 5 21 L 19 21 C 19.53 21 20.039 20.789 20.414 20.414 C 20.789 20.039 21 19.53 21 19 L 21 5 C 21 3.89 20.1 3 19 3 M 19 5 L 19 19 L 5 19 L 5 5 L 19 5 Z"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
<target android:name="group">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="scaleX"
android:duration="150"
android:valueFrom="1"
android:valueTo="0.9"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleY"
android:duration="150"
android:valueFrom="1"
android:valueTo="0.9"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleX"
android:startOffset="150"
android:duration="150"
android:valueFrom="0.9"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleY"
android:startOffset="150"
android:duration="150"
android:valueFrom="0.9"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
</animated-vector>

View File

@ -0,0 +1,80 @@
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
android:name="vector"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<group
android:name="group"
android:pivotX="12"
android:pivotY="12">
<path
android:name="path"
android:pathData="M 19 3 L 5 3 C 3.89 3 3 3.89 3 5 L 3 19 C 3 19.53 3.211 20.039 3.586 20.414 C 3.961 20.789 4.47 21 5 21 L 19 21 C 19.53 21 20.039 20.789 20.414 20.414 C 20.789 20.039 21 19.53 21 19 L 21 5 C 21 3.89 20.1 3 19 3 M 19 5 L 19 19 L 5 19 L 5 5 L 19 5 Z"
android:fillColor="#000"
android:strokeWidth="1"/>
</group>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="150"
android:valueFrom="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.9 20.1 3 19 3 C 19 3 19 3 19 3 M 10 17 L 5 12 L 6.4 10.6 L 10 14.2 L 17.6 6.6 L 19 8"
android:valueTo="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 20.1 3.9 21 5 21 L 19 21 C 20.1 21 21 20.1 21 19 L 21 5 C 21 3.913 20.122 3.022 19.04 3 C 19.027 3 19.013 3 19 3 M 12.7 12.7 L 11.3 12.7 L 11.3 11.3 L 12.7 11.3 L 12.7 11.3 L 12.7 12.7"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="150"
android:duration="150"
android:valueFrom="M 19 3 L 5 3 C 3.9 3 3 3.9 3 5 L 3 19 C 3 19.559 3.232 20.066 3.605 20.43 C 3.966 20.782 4.459 21 5 21 L 19 21 C 19.507 21 19.971 20.809 20.324 20.496 C 20.738 20.128 21 19.593 21 19 L 21 5 C 21 3.9 20.1 3 19 3 M 12.7 11.3 L 12.7 12.7 L 11.3 12.7 L 11.3 11.3 L 12.7 11.3 Z"
android:valueTo="M 19 3 L 5 3 C 3.89 3 3 3.89 3 5 L 3 19 C 3 19.53 3.211 20.039 3.586 20.414 C 3.961 20.789 4.47 21 5 21 L 19 21 C 19.53 21 20.039 20.789 20.414 20.414 C 20.789 20.039 21 19.53 21 19 L 21 5 C 21 3.89 20.1 3 19 3 M 19 5 L 19 19 L 5 19 L 5 5 L 19 5 Z"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
<target android:name="group">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="scaleX"
android:duration="150"
android:valueFrom="1"
android:valueTo="0.9"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleY"
android:duration="150"
android:valueFrom="1"
android:valueTo="0.9"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleX"
android:startOffset="150"
android:duration="150"
android:valueFrom="0.9"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="scaleY"
android:startOffset="150"
android:duration="150"
android:valueFrom="0.9"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
</animated-vector>