ui: use colorOnSurface

Use colorOnSurface for the first time ever. I decided to pick a color
that was as non-intrusive as possible that was still differentiateable,
and I think it looks like a net improvement. It will probably be
tweaked a bit in the future as I expand it to other elevated views.
This commit is contained in:
OxygenCobalt 2021-08-30 20:19:52 -06:00
parent 765f92ca98
commit acabe9217b
No known key found for this signature in database
GPG key ID: 37DBE3621FE9AD47
5 changed files with 44 additions and 17 deletions

View file

@ -33,7 +33,6 @@ import org.oxycblt.auxio.databinding.ActivityMainBinding
import org.oxycblt.auxio.playback.PlaybackViewModel
import org.oxycblt.auxio.playback.system.PlaybackService
import org.oxycblt.auxio.settings.SettingsManager
import org.oxycblt.auxio.util.applyEdge
import org.oxycblt.auxio.util.isNight
import org.oxycblt.auxio.util.logD
@ -54,12 +53,6 @@ class MainActivity : AppCompatActivity() {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O_MR1) {
applyEdgeToEdgeWindow(binding)
// If there are left/right insets [signalling that we are in phone landscape mode],
// we will always apply them.
binding.applyEdge { bars ->
binding.root.updatePadding(left = bars.left, right = bars.right)
}
} else {
binding.root.fitsSystemWindows = true
}
@ -126,15 +119,35 @@ class MainActivity : AppCompatActivity() {
WindowInsets.Type.systemBars(),
insets.getInsetsIgnoringVisibility(WindowInsets.Type.systemBars())
)
.build()
.build().also {
val bars = it.getInsets(WindowInsets.Type.systemBars())
// If left/right insets are present [implying phone landscape mode],
// make sure that we apply them.
binding.root.updatePadding(
left = bars.left,
right = bars.right
)
}
}
} else {
// Do old edge-to-edge otherwise.
logD("Doing legacy edge-to-edge.")
@Suppress("DEPRECATION")
binding.root.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION or
View.SYSTEM_UI_FLAG_LAYOUT_STABLE
binding.root.apply {
systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION or
View.SYSTEM_UI_FLAG_LAYOUT_STABLE
setOnApplyWindowInsetsListener { v, insets ->
updatePadding(
left = insets.systemWindowInsetLeft,
right = insets.systemWindowInsetRight
)
insets
}
}
}
}

View file

@ -21,7 +21,7 @@
android:elevation="@dimen/elevation_normal"
android:focusable="true">
<androidx.appcompat.widget.Toolbar
<com.google.android.material.appbar.MaterialToolbar
android:id="@+id/home_toolbar"
style="@style/Widget.Toolbar"
app:layout_scrollFlags="scroll|enterAlways"

View file

@ -39,7 +39,7 @@
android:id="@+id/search_edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorSurface"
android:background="@android:color/transparent"
android:hint="@string/hint_search_library"
android:imeOptions="actionSearch|flagNoExtractUi"
android:inputType="textFilter"

View file

@ -1,9 +1,25 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!--
Sometimes we need to use the surface colors for modes that aren't the current one.
Colors are kept here just in case
-->
<color name="surface_day">#fffafafa</color>
<color name="surface_night">#ff151515</color>
<color name="surface_night">#ff121212</color>
<color name="surface_black">#ff000000</color>
<!--
By default, colorOnSurface when applied sticks out like a sore thumb, so we
darken it a little so it lines up with our dark mode backgrounds.
Yes, this is a flagrant violation of material, but they also say that #121212 is
the recommended black dark color so they have no right to an opinion here.
-->
<color name="on_surface">#606060</color>
<color name="on_surface_black">#CDCDCD</color>
<!--
Typical UI colors.
-->
<color name="surface">@color/surface_day</color>
<color name="selection">#cbcbcb</color>
<color name="control">#202020</color>

View file

@ -9,13 +9,10 @@
<!-- Base theme -->
<style name="Theme.Base" parent="Theme.Splash">
<!-- TODO: Improve the color contrast on the dark theme [colorOnSurface] -->
<!-- TODO: Migrate to liftOnScroll everywhere that is not HomeFragment -->
<!-- Colors -->
<item name="colorSurface">@color/surface</item>
<item name="colorAccent">@color/design_default_color_primary</item>
<item name="colorOnSurface">#00000000</item>
<item name="colorOnSurface">@color/on_surface</item>
<item name="colorPrimary">?attr/colorAccent</item>
<item name="colorSecondary">?attr/colorAccent</item>
@ -50,6 +47,7 @@
<!-- The basic black theme derived in all black accents. -->
<style name="Theme.Base.Black" parent="Theme.Base">
<item name="colorSurface">@color/surface_black</item>
<item name="colorOnSurface">@color/on_surface_black</item>
<item name="materialAlertDialogTheme">@style/Theme.CustomDialog.Black</item>
</style>