Bottom sheet improvements

This commit is contained in:
Zakhar Timoshenko
2022-05-18 22:14:14 +03:00
parent 21f7b7120a
commit 0932507346
18 changed files with 106 additions and 22 deletions

View File

@@ -1,19 +1,18 @@
package org.koitharu.kotatsu.base.ui
import android.app.Dialog
import android.os.Bundle
import android.util.DisplayMetrics
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.view.ViewGroup.LayoutParams
import androidx.appcompat.app.AppCompatDialog
import androidx.core.view.updateLayoutParams
import androidx.viewbinding.ViewBinding
import com.google.android.material.bottomsheet.BottomSheetBehavior
import com.google.android.material.bottomsheet.BottomSheetDialog
import com.google.android.material.bottomsheet.BottomSheetDialogFragment
import org.koitharu.kotatsu.R
import org.koitharu.kotatsu.base.ui.dialog.AppBottomSheetDialog
import org.koitharu.kotatsu.utils.ext.displayCompat
import com.google.android.material.R as materialR
abstract class BaseBottomSheet<B : ViewBinding> : BottomSheetDialogFragment() {
@@ -33,6 +32,20 @@ abstract class BaseBottomSheet<B : ViewBinding> : BottomSheetDialogFragment() {
): View {
val binding = onInflateView(inflater, container)
viewBinding = binding
// Enforce max width for tablets
val width = resources.getDimensionPixelSize(R.dimen.bottom_sheet_width)
if (width > 0) {
behavior?.maxWidth = width
}
// Set peek height to 50% display height
requireContext().displayCompat?.let {
val metrics = DisplayMetrics()
it.getRealMetrics(metrics)
behavior?.peekHeight = metrics.heightPixels / 2
}
return binding.root
}
@@ -41,14 +54,6 @@ abstract class BaseBottomSheet<B : ViewBinding> : BottomSheetDialogFragment() {
super.onDestroyView()
}
override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
return if (resources.getBoolean(R.bool.is_tablet)) {
AppCompatDialog(context, R.style.Theme_Kotatsu_Dialog)
} else {
AppBottomSheetDialog(requireContext(), theme)
}
}
protected abstract fun onInflateView(inflater: LayoutInflater, container: ViewGroup?): B
protected fun setExpanded(isExpanded: Boolean, isLocked: Boolean) {

View File

@@ -233,6 +233,8 @@ class MainActivity :
}
binding.toolbarCard.updateLayoutParams<MarginLayoutParams> {
topMargin = insets.top + bottomMargin
leftMargin = insets.left
rightMargin = insets.right
}
binding.root.updatePadding(
left = insets.left,

View File

@@ -0,0 +1,15 @@
package org.koitharu.kotatsu.utils.ext
import android.content.Context
import android.os.Build
import android.view.Display
import android.view.WindowManager
import androidx.core.content.getSystemService
val Context.displayCompat: Display?
get() = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
display
} else {
@Suppress("DEPRECATION")
getSystemService<WindowManager>()?.defaultDisplay
}

View File

@@ -0,0 +1,10 @@
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="300"
android:interpolator="@android:interpolator/fast_out_slow_in">
<translate
android:fromYDelta="100%p"
android:toYDelta="0" />
</set>

View File

@@ -0,0 +1,10 @@
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="300"
android:interpolator="@android:interpolator/fast_out_slow_in">
<translate
android:fromYDelta="0"
android:toYDelta="100%p" />
</set>

View File

@@ -0,0 +1,15 @@
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:left="-2dp"
android:right="-2dp"
android:top="-2dp">
<shape>
<solid android:color="@android:color/transparent" />
<stroke
android:width="1dp"
android:color="?android:attr/divider" />
</shape>
</item>
</layer-list>

View File

@@ -11,6 +11,6 @@
android:layout_height="wrap_content"
android:layout_gravity="center"
android:indeterminate="true"
app:indicatorSize="@dimen/list_footer_height_inner" />
app:indicatorSize="24dp"/>
</FrameLayout>

View File

@@ -10,7 +10,7 @@
<com.google.android.material.appbar.MaterialToolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
android:layout_height="?attr/actionBarSize" />
<ScrollView
android:id="@+id/scrollView"

View File

@@ -9,6 +9,7 @@
android:layout_width="@dimen/list_footer_height_inner"
android:layout_height="@dimen/list_footer_height_inner"
android:layout_gravity="center"
android:indeterminate="true" />
android:indeterminate="true"
android:padding="8dp"/>
</FrameLayout>

View File

@@ -10,7 +10,8 @@
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
android:layout_height="?attr/actionBarSize"
android:background="@drawable/sheet_toolbar_background">
<com.google.android.material.appbar.MaterialToolbar
android:id="@+id/toolbar"

View File

@@ -10,7 +10,8 @@
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
android:layout_height="?attr/actionBarSize"
android:background="@drawable/sheet_toolbar_background">
<com.google.android.material.appbar.MaterialToolbar
android:id="@+id/toolbar"

View File

@@ -10,7 +10,8 @@
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
android:layout_height="?attr/actionBarSize"
android:background="@drawable/sheet_toolbar_background">
<com.google.android.material.appbar.MaterialToolbar
android:id="@+id/toolbar"

View File

@@ -7,5 +7,6 @@
<color name="onErrorContainer">#FFDAD4</color>
<color name="scrollbar">#66FFFFFF</color>
<color name="selector_foreground">#29FFFFFF</color>
<color name="divider_default">#1FFFFFFF</color>
</resources>

View File

@@ -3,4 +3,5 @@
<dimen name="grid_spacing">6dp</dimen>
<dimen name="grid_spacing_outer">2dp</dimen>
<dimen name="preferred_grid_width">140dp</dimen>
<dimen name="bottom_sheet_width">420dp</dimen>
</resources>

View File

@@ -20,5 +20,6 @@
<color name="dim">#99000000</color>
<color name="scrollbar">#66000000</color>
<color name="selector_foreground">#29000000</color>
<color name="divider_default">#1F000000</color>
</resources>

View File

@@ -26,4 +26,7 @@
<dimen name="search_suggestions_manga_height">124dp</dimen>
<dimen name="search_suggestions_manga_spacing">4dp</dimen>
<dimen name="bottom_sheet_width">0dp</dimen>
<dimen name="dialog_radius">8dp</dimen>
</resources>

View File

@@ -22,9 +22,26 @@
<!-- Bottom sheet -->
<style name="ThemeOverlay.Kotatsu.BottomSheetDialog" parent="ThemeOverlay.Material3.DayNight.BottomSheetDialog">
<item name="android:statusBarColor">@color/dim</item>
<item name="colorControlHighlight">?colorSecondary</item>
<style name="ThemeOverlay.Kotatsu.BottomSheetDialog" parent="ThemeOverlay.Material3.BottomSheetDialog">
<item name="bottomSheetStyle">@style/Widget.Kotatsu.BottomSheet.Modal</item>
<item name="android:windowAnimationStyle">@style/Animation.Kotatsu.BottomSheetDialog</item>
</style>
<style name="Widget.Kotatsu.BottomSheet.Modal" parent="Widget.Material3.BottomSheet.Modal">
<item name="shapeAppearanceOverlay">@style/ShapeAppearanceOverlay.Kotatsu.BottomSheet</item>
</style>
<style name="ShapeAppearanceOverlay.Kotatsu.BottomSheet" parent="">
<item name="cornerFamily">rounded</item>
<item name="cornerSizeTopRight">@dimen/dialog_radius</item>
<item name="cornerSizeTopLeft">@dimen/dialog_radius</item>
<item name="cornerSizeBottomRight">0dp</item>
<item name="cornerSizeBottomLeft">0dp</item>
</style>
<style name="Animation.Kotatsu.BottomSheetDialog" parent="Animation.AppCompat.Dialog">
<item name="android:windowEnterAnimation">@anim/bottom_sheet_slide_in</item>
<item name="android:windowExitAnimation">@anim/bottom_sheet_slide_out</item>
</style>
<!-- Widget styles -->

View File

@@ -35,6 +35,8 @@
<item name="colorErrorContainer">@color/errorContainer</item>
<item name="colorOnErrorContainer">@color/onErrorContainer</item>
<item name="android:divider">@color/divider_default</item>
<!-- Ripples -->
<item name="colorControlHighlight">?attr/colorSurfaceVariant</item>
@@ -81,8 +83,6 @@
<!--== Default Theme ==-->
<style name="Theme.Kotatsu" parent="Base.Theme.Kotatsu" />
<style name="Theme.Kotatsu.DialogWhenLarge" />
<!-- Monet theme only support S+ -->
<style name="Theme.Kotatsu.Monet" />