Skip to content

Commit

Permalink
[Feature] Update Material Components for Android to 1.11.0.
Browse files Browse the repository at this point in the history
  • Loading branch information
zhanghai committed Jan 17, 2024
1 parent d9ce4e6 commit e1f9661
Show file tree
Hide file tree
Showing 4 changed files with 49 additions and 81 deletions.
2 changes: 1 addition & 1 deletion app/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -134,7 +134,7 @@ dependencies {
implementation 'androidx.preference:preference-ktx:1.2.1'
implementation 'androidx.recyclerview:recyclerview:1.3.2'
implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0'
implementation 'com.google.android.material:material:1.10.0'
implementation 'com.google.android.material:material:1.11.0'

implementation 'com.caverock:androidsvg-aar:1.4'
implementation 'com.davemorrissey.labs:subsampling-scale-image-view-androidx:3.10.0'
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -218,7 +218,7 @@ class FileListFragment : Fragment(), BreadcrumbLayout.Listener, FileListAdapter.
binding.appBarLayout.totalScrollRange + verticalOffset
)
}
binding.appBarLayout.syncBackgroundElevationTo(binding.overlayToolbar)
binding.appBarLayout.syncBackgroundColorTo(binding.overlayToolbar)
binding.breadcrumbLayout.setListener(this)
if (!(activity.hasSw600Dp && activity.isOrientationLandscape)) {
binding.swipeRefreshLayout.setProgressViewEndTarget(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,28 +6,23 @@
package me.zhanghai.android.files.ui

import android.content.Context
import android.content.res.ColorStateList
import android.graphics.Color
import android.graphics.Rect
import android.os.Build
import android.util.AttributeSet
import android.view.View
import androidx.annotation.AttrRes
import androidx.coordinatorlayout.widget.CoordinatorLayout
import androidx.core.graphics.ColorUtils
import com.google.android.material.appbar.AppBarLayout.OnOffsetChangedListener
import com.google.android.material.shape.MaterialShapeDrawable
import com.google.android.material.shape.MaterialShapeDrawableAccessor
import com.google.android.material.shape.MaterialShapeUtils
import me.zhanghai.android.files.util.activity

class CoordinatorAppBarLayout : FitsSystemWindowsAppBarLayout {
private val tempConsumed = IntArray(2)
private val syncBackgroundColorViews = mutableListOf<View>()

private var offset = 0
private val tempClipBounds = Rect()

private val syncBackgroundElevationViews = mutableListOf<View>()

constructor(context: Context) : super(context)

constructor(context: Context, attrs: AttributeSet?) : super(context, attrs)
Expand All @@ -39,32 +34,24 @@ class CoordinatorAppBarLayout : FitsSystemWindowsAppBarLayout {
) : super(context, attrs, defStyleAttr)

init {
val background = background
val backgroundColor = (background as? MaterialShapeDrawable)?.fillColor?.defaultColor
if (backgroundColor != null) {
val defaultBackgroundColor = (background as? MaterialShapeDrawable)?.fillColor?.defaultColor
if (defaultBackgroundColor != null) {
val window = context.activity!!.window
val statusBarColor = window.statusBarColor
if (backgroundColor == statusBarColor
|| backgroundColor == ColorUtils.setAlphaComponent(statusBarColor, 0xFF)) {
if (defaultBackgroundColor == statusBarColor
|| defaultBackgroundColor == ColorUtils.setAlphaComponent(statusBarColor, 0xFF)) {
window.statusBarColor = Color.TRANSPARENT
}
}

viewTreeObserver.addOnPreDrawListener {
updateLiftedState()
true
}

if (background is MaterialShapeDrawable) {
this.background = OnElevationChangedMaterialShapeDrawable(
background, this::onBackgroundElevationChanged
)
addLiftOnScrollListener { _, backgroundColor ->
onBackgroundColorChanged(backgroundColor)
}

addOnOffsetChangedListener(OnOffsetChangedListener { _, offset ->
addOnOffsetChangedListener { _, offset ->
this.offset = offset
updateFirstChildClipBounds()
})
}
}

override fun onFinishInflate() {
Expand All @@ -77,24 +64,15 @@ class CoordinatorAppBarLayout : FitsSystemWindowsAppBarLayout {
}
}

fun syncBackgroundElevationTo(view: View) {
syncBackgroundElevationViews += view
}

private fun onBackgroundElevationChanged(elevation: Float) {
syncBackgroundElevationViews.forEach { MaterialShapeUtils.setElevation(it, elevation) }
fun syncBackgroundColorTo(view: View) {
syncBackgroundColorViews += view
}

private fun updateLiftedState() {
if (!isLiftOnScroll) {
return
private fun onBackgroundColorChanged(backgroundColor: Int) {
syncBackgroundColorViews.forEach {
(it.background as? MaterialShapeDrawable)?.fillColor =
ColorStateList.valueOf(backgroundColor)
}
val coordinatorLayout = parent as? CoordinatorLayout ?: return
// Call AppBarLayout.Behavior.onNestedPreScroll() with dy == 0 to update lifted state.
val behavior = (layoutParams as CoordinatorLayout.LayoutParams).behavior ?: return
behavior.onNestedPreScroll(
coordinatorLayout, this, coordinatorLayout, 0, 0, tempConsumed, 0
)
}

private fun updateFirstChildClipBounds() {
Expand All @@ -110,23 +88,4 @@ class CoordinatorAppBarLayout : FitsSystemWindowsAppBarLayout {
}
firstChild.clipBounds = tempClipBounds
}

private class OnElevationChangedMaterialShapeDrawable(
drawable: MaterialShapeDrawable,
private val onElevationChanged: (Float) -> Unit
) : MaterialShapeDrawable() {
init {
fillColor = drawable.fillColor
MaterialShapeDrawableAccessor.setElevationOverlayProvider(
this, MaterialShapeDrawableAccessor.getElevationOverlayProvider(drawable)
)
MaterialShapeDrawableAccessor.updateZ(this)
}

override fun setElevation(elevation: Float) {
super.setElevation(elevation)

onElevationChanged(elevation)
}
}
}
53 changes: 31 additions & 22 deletions app/src/main/res/values/colors_google_material3.xml
Original file line number Diff line number Diff line change
Expand Up @@ -11,70 +11,79 @@
tools:ignore="PrivateResource">

<color name="m3_ref_palette_neutral0">#000000</color>
<color name="m3_ref_palette_neutral4">#0E0E0F</color>
<color name="m3_ref_palette_neutral6">#131314</color>
<color name="m3_ref_palette_neutral10">#1F1F1F</color>
<color name="m3_ref_palette_neutral12">#1F2020</color>
<color name="m3_ref_palette_neutral17">#2A2A2A</color>
<color name="m3_ref_palette_neutral20">#303030</color>
<color name="m3_ref_palette_neutral30">@null</color>
<color name="m3_ref_palette_neutral40">@null</color>
<color name="m3_ref_palette_neutral22">#343535</color>
<color name="m3_ref_palette_neutral24">#393939</color>
<color name="m3_ref_palette_neutral30">#474747</color>
<color name="m3_ref_palette_neutral40">#5E5E5E</color>
<color name="m3_ref_palette_neutral50">#757575</color>
<color name="m3_ref_palette_neutral60">@null</color>
<color name="m3_ref_palette_neutral70">@null</color>
<color name="m3_ref_palette_neutral60">#8F8F8F</color>
<color name="m3_ref_palette_neutral70">#ABABAB</color>
<color name="m3_ref_palette_neutral80">#C7C7C7</color>
<color name="m3_ref_palette_neutral87">#DADADA</color>
<color name="m3_ref_palette_neutral90">#E3E3E3</color>
<color name="m3_ref_palette_neutral92">#E9E8E8</color>
<color name="m3_ref_palette_neutral94">#EFEDED</color>
<color name="m3_ref_palette_neutral95">#F2F2F2</color>
<color name="m3_ref_palette_neutral99">@null</color>
<color name="m3_ref_palette_neutral96">#F4F3F2</color>
<color name="m3_ref_palette_neutral98">#FAF9F8</color>
<color name="m3_ref_palette_neutral99">#FDFCFB</color>
<color name="m3_ref_palette_neutral100">#FFFFFF</color>
<color name="m3_ref_palette_neutral_variant0">#000000</color>
<color name="m3_ref_palette_neutral_variant10">@null</color>
<color name="m3_ref_palette_neutral_variant20">@null</color>
<color name="m3_ref_palette_neutral_variant10">#191D1C</color>
<color name="m3_ref_palette_neutral_variant20">#2D312F</color>
<color name="m3_ref_palette_neutral_variant30">#444746</color>
<color name="m3_ref_palette_neutral_variant40">#5C5F5E</color>
<color name="m3_ref_palette_neutral_variant50">#747775</color>
<color name="m3_ref_palette_neutral_variant60">#8E918F</color>
<color name="m3_ref_palette_neutral_variant70">@null</color>
<color name="m3_ref_palette_neutral_variant70">#A9ACAA</color>
<color name="m3_ref_palette_neutral_variant80">#C4C7C5</color>
<color name="m3_ref_palette_neutral_variant90">#E1E3E1</color>
<color name="m3_ref_palette_neutral_variant95">@null</color>
<color name="m3_ref_palette_neutral_variant99">@null</color>
<color name="m3_ref_palette_neutral_variant95">#EFF2EF</color>
<color name="m3_ref_palette_neutral_variant99">#FAFDFB</color>
<color name="m3_ref_palette_neutral_variant100">#FFFFFF</color>
<color name="m3_ref_palette_primary0">#000000</color>
<color name="m3_ref_palette_primary10">#041E49</color>
<color name="m3_ref_palette_primary20">#062E6F</color>
<color name="m3_ref_palette_primary30">#0842A0</color>
<color name="m3_ref_palette_primary40">#0B57D0</color>
<color name="m3_ref_palette_primary50">#1B6EF3</color>
<color name="m3_ref_palette_primary60">@null</color>
<color name="m3_ref_palette_primary60">#4C8DF6</color>
<color name="m3_ref_palette_primary70">#7CACF8</color>
<color name="m3_ref_palette_primary80">#A8C7FA</color>
<color name="m3_ref_palette_primary90">#D3E3FD</color>
<color name="m3_ref_palette_primary95">#ECF3FE</color>
<color name="m3_ref_palette_primary99">@null</color>
<color name="m3_ref_palette_primary99">#FAFBFF</color>
<color name="m3_ref_palette_primary100">#FFFFFF</color>
<color name="m3_ref_palette_secondary0">#000000</color>
<color name="m3_ref_palette_secondary10">#001D35</color>
<color name="m3_ref_palette_secondary20">#003355</color>
<color name="m3_ref_palette_secondary30">#004A77</color>
<color name="m3_ref_palette_secondary40">#00639B</color>
<color name="m3_ref_palette_secondary50">@null</color>
<color name="m3_ref_palette_secondary60">@null</color>
<color name="m3_ref_palette_secondary50">#047DB7</color>
<color name="m3_ref_palette_secondary60">#3998D3</color>
<color name="m3_ref_palette_secondary70">#5AB3F0</color>
<color name="m3_ref_palette_secondary80">#7FCFFF</color>
<color name="m3_ref_palette_secondary90">#C2E7FF</color>
<color name="m3_ref_palette_secondary95">#DFF3FF</color>
<color name="m3_ref_palette_secondary99">@null</color>
<color name="m3_ref_palette_secondary99">#F7FCFF</color>
<color name="m3_ref_palette_secondary100">#FFFFFF</color>
<color name="m3_ref_palette_tertiary0">#000000</color>
<color name="m3_ref_palette_tertiary10">#072711</color>
<color name="m3_ref_palette_tertiary20">#0A3818</color>
<color name="m3_ref_palette_tertiary30">#0F5223</color>
<color name="m3_ref_palette_tertiary40">#146C2E</color>
<color name="m3_ref_palette_tertiary50">@null</color>
<color name="m3_ref_palette_tertiary60">@null</color>
<color name="m3_ref_palette_tertiary70">@null</color>
<color name="m3_ref_palette_tertiary50">#198639</color>
<color name="m3_ref_palette_tertiary60">#1EA446</color>
<color name="m3_ref_palette_tertiary70">#37BE5F</color>
<color name="m3_ref_palette_tertiary80">#6DD58C</color>
<color name="m3_ref_palette_tertiary90">#C4EED0</color>
<color name="m3_ref_palette_tertiary95">@null</color>
<color name="m3_ref_palette_tertiary99">@null</color>
<color name="m3_ref_palette_tertiary95">#E7F8ED</color>
<color name="m3_ref_palette_tertiary99">#F2FFEE</color>
<color name="m3_ref_palette_tertiary100">#FFFFFF</color>
<color name="m3_sys_color_light_background">@color/m3_ref_palette_neutral100</color>
<color name="m3_sys_color_light_surface">@color/m3_ref_palette_neutral100</color>
</resources>

0 comments on commit e1f9661

Please sign in to comment.