Skip to content

Commit

Permalink
fix(browser): align bottom sheet with app bar
Browse files Browse the repository at this point in the history
  • Loading branch information
@david-allison
david-allison committed Aug 11, 2024
1 parent eb373ec commit 653223b
Show file tree
Hide file tree
Showing 5 changed files with 89 additions and 63 deletions.
2 changes: 1 addition & 1 deletion AnkiDroid/src/main/java/com/ichi2/anki/browser/CardStateSheetFragment.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ class CardStateSheetFragment : BottomSheetFragment() {
icon = state.icon,
text = state.label,
subtitle = state.subtitle,
indent = 0,
indent = -1,
checkable = true
)
}
Expand Down
2 changes: 1 addition & 1 deletion AnkiDroid/src/main/java/com/ichi2/anki/browser/FlagsSheetFragment.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ class FlagsSheetFragment : BottomSheetFragment() {
id = flag.code.toLong(),
icon = flag.drawableRes,
text = displayName,
indent = 0,
indent = -1,
checkable = true
)
}
Expand Down
14 changes: 10 additions & 4 deletions AnkiDroid/src/main/java/com/ichi2/anki/browser/TreeAdapter.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,10 @@ abstract class TreeAdapter(val context: Context) : RecyclerView.Adapter<TreeAdap
@DrawableRes val icon: Int?,
val text: CharSequence,
val subtitle: String?,
/**
* -1 is used as a sentinel value to define 'no indent', even if a chevron may appear
* on other elements
*/
val indent: Int,
val collapsed: Collapsed,
val checked: Checked
Expand Down Expand Up @@ -123,8 +127,11 @@ abstract class TreeAdapter(val context: Context) : RecyclerView.Adapter<TreeAdap
}

fun fullBind(item: Item) {
chevron.updateLayoutParams<MarginLayoutParams> {
marginStart = (mandatoryMargin + indentMargin * item.indent).toInt()
chevron.isVisible = item.indent != -1
if (item.indent != -1) {
chevron.updateLayoutParams<MarginLayoutParams> {
marginStart = (mandatoryMargin + indentMargin * item.indent).toInt()
}
}

text.text = item.text
Expand All @@ -136,8 +143,6 @@ abstract class TreeAdapter(val context: Context) : RecyclerView.Adapter<TreeAdap
icon.setImageDrawable(AppCompatResources.getDrawable(context, iconToUse))
}

// isVisible takes precedence over .alpha
chevron.visibility = if (item.indent == -1) View.GONE else View.VISIBLE
chevron.animate().cancel()

when (item.collapsed) {
Expand Down Expand Up @@ -212,6 +217,7 @@ private infix fun <E> Set<E>.xor(element: E) =

context(RecyclerView.ViewHolder)
private fun View.setOnClickListenerWithId(block: (Long) -> Unit) {
// TODO: The ripple effect does not occur properly
setOnClickListener {
// TODO: The ripple effect does not occur properly on click
val id = itemId
Expand Down
129 changes: 73 additions & 56 deletions AnkiDroid/src/main/res/layout/bottom_sheet_item.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,12 @@
~ this program. If not, see <http://www.gnu.org/licenses/>.
-->

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
<!--
Designed to align the leftmost image
(chevron/icon) with the menu icon in the app bar when inside a bottom sheet
-->
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
Expand All @@ -23,73 +28,85 @@
android:minHeight="?android:attr/listPreferredItemHeightSmall"
android:focusable="true"
android:clickable="true"
android:layoutDirection="locale">
android:layoutDirection="locale"
android:paddingStart="14dp"
>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:orientation="horizontal"
android:minWidth="?attr/minTouchTargetSize"
android:minHeight="?attr/minTouchTargetSize"
>

<ImageView
android:id="@+id/chevron"
style="@style/Widget.MaterialComponents.CompoundButton.CheckBox"
android:layout_width="40dp"
android:layout_height="match_parent"
android:gravity="center"
android:paddingStart="8dp"
android:paddingEnd="8dp"
app:srcCompat="@drawable/ic_chevron_right_black"
/>
<ImageView
android:id="@+id/chevron"
style="@style/Widget.MaterialComponents.CompoundButton.CheckBox"
android:layout_width="24dp"
android:layout_height="24dp"
app:layout_constraintBottom_toBottomOf="@+id/firstRowGuideline"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="@drawable/ic_chevron_right_black" />

<ImageView
android:id="@+id/icon"
android:layout_width="24dp"
android:layout_height="match_parent"
android:gravity="center"
android:layout_marginStart="8dp"
android:layout_marginEnd="12dp"
tools:src="@drawable/ic_flag_transparent"
/>
<ImageView
android:id="@+id/icon"
android:layout_width="24dp"
android:layout_height="match_parent"
android:layout_marginStart="2dp"
app:layout_constraintStart_toEndOf="@id/chevron"
app:layout_constraintTop_toTopOf="@+id/chevron"
app:layout_constraintBottom_toBottomOf="@+id/chevron"
tools:src="@drawable/ic_flag_transparent" />

<TextView
android:id="@+id/text"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="start|center_vertical"
android:textAppearance="?android:textAppearanceMedium"
android:textDirection="locale"
android:textAlignment="gravity"
android:paddingEnd="8dp"
tools:text="Title"
/>
<!--
TODO: This should be centered if the only element
and not centered if a subtitle exists to save space
-->
<TextView
android:id="@+id/text"
android:layout_width="0dp"
android:layout_height="0dp"
android:gravity="start|center_vertical"
android:paddingEnd="8dp"
android:textAlignment="gravity"
android:textAppearance="?android:textAppearanceMedium"
android:textDirection="locale"
android:layout_marginStart="8dp"
app:layout_constraintEnd_toStartOf="@+id/checkbox"
app:layout_constraintStart_toEndOf="@id/icon"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="@+id/firstRowGuideline"
tools:text="Title" />

<CheckBox
android:id="@+id/checkbox"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:paddingEnd="24dp"
/>
</LinearLayout>

<CheckBox
android:id="@+id/checkbox"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:layout_constraintEnd_toEndOf="parent"
android:paddingEnd="16dp" />


<!-- Intended to be the same height as the Checkbox (since the checkbox is optional) -->
<androidx.constraintlayout.widget.Guideline
android:id="@+id/firstRowGuideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="48dp" />

<TextView
android:id="@+id/subtitle"
android:paddingStart="36dp"
android:layout_width="match_parent"
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="start|center_vertical"
android:paddingBottom="12dp"
android:paddingEnd="48dp"
android:textAlignment="gravity"
android:textAppearance="?android:textAppearanceSmall"
android:textColor="?android:attr/textColorSecondary"
android:textDirection="locale"
android:textAlignment="gravity"
android:layout_marginTop="-8dp"
android:paddingEnd="48dp"
android:visibility="gone"
android:paddingBottom="4dp"
android:layout_marginTop="-8dp"
app:layout_constraintStart_toStartOf="@+id/text"
app:layout_constraintTop_toBottomOf="@+id/firstRowGuideline"
app:layout_constraintEnd_toStartOf="@id/checkbox"
tools:text="This is a long subtitle explaining really important things"
/>
</LinearLayout>
tools:visibility="visible" />

</androidx.constraintlayout.widget.ConstraintLayout>
5 changes: 4 additions & 1 deletion AnkiDroid/src/main/res/layout/card_browser.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,20 +68,23 @@
android:layout_width="match_parent"
android:background="?android:attr/colorBackground"
android:orientation="horizontal"
android:layout_height="?attr/listPreferredItemHeight">
android:layout_height="48dp"
android:layout_marginTop="-8dp" >

<Spinner
android:id="@+id/browser_column1_spinner"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:dropDownVerticalOffset="8dp"
/>

<Spinner
android:id="@+id/browser_column2_spinner"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:dropDownVerticalOffset="8dp"
/>
</LinearLayout>

Expand Down

0 comments on commit 653223b

Please sign in to comment.