github/tachiyomi
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add better library item selectors (#5240)

Browse source 
* Add better library item selectors

Inspired by the J2K method of library item selection.

* Tweak theme selection colors

It was missing for Hot Pink and Midnight Dusk.

The selector color is 75% alpha of the color accent, this looked fitting for all themes.
This commit is contained in:
Soitora 2021-06-01 23:56:36 +02:00 committed by GitHub
parent 5113c78ab6
commit 88d9ffe92e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 45 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
app/src/main/res/drawable/library_item_selector.xml
View file

@ -3,16 +3,39 @@
android:color="?attr/colorLibrarySelection">
<item>
<selector>
<item android:state_selected="true">
<color android:color="?attr/colorLibrarySelectionActive" />
<item
android:state_selected="true"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"
android:left="2dp">
<shape android:shape="rectangle">
<corners android:radius="@dimen/card_radius" />
<solid android:color="?attr/colorLibrarySelectionActive" />
</shape>
</item>
<item android:state_activated="true">
<color android:color="?attr/colorLibrarySelectionActive" />
<item
android:state_activated="true"
android:top="2dp"
android:right="2dp"
android:bottom="2dp"
android:left="2dp">
<shape android:shape="rectangle">
<corners android:radius="@dimen/card_radius" />
<solid android:color="?attr/colorLibrarySelectionActive" />
</shape>
</item>
<item>
<color android:color="?android:attr/colorBackground" />
<item
android:top="2dp"
android:right="2dp"
android:bottom="2dp"
android:left="2dp">
<shape android:shape="rectangle">
<corners android:radius="@dimen/card_radius" />
<solid android:color="?android:attr/colorBackground" />
</shape>
</item>
</selector>
</item>

1
app/src/main/res/layout/source_comfortable_grid_item.xml
View file

@ -4,6 +4,7 @@
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="2dp"
android:background="@drawable/library_item_selector"
android:padding="4dp">

1
app/src/main/res/layout/source_compact_grid_item.xml
View file

@ -3,6 +3,7 @@
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="2dp"
android:background="@drawable/library_item_selector"
android:padding="4dp">

14
app/src/main/res/values/colors.xml
View file

@ -26,12 +26,12 @@
<color name="rippleToolbarColorLight">@color/rippleColorLight</color>
<color name="backgroundLight">@color/md_grey_50</color>
<color name="dialogLight">@color/md_white_1000</color>
<color name="selectorColorLight">@color/md_blue_A400_38</color>
<color name="selectorColorLight">@color/md_blue_A400_75</color>
<!-- Strawberry Daiquiri Theme -->
<color name="colorAccentStrawberry">#ED4A65</color>
<color name="rippleSecondaryColorStrawberry">#0AED4A65</color>
<color name="selectorColorStrawberry">#6FED4A65</color>
<color name="selectorColorStrawberry">#BFED4A65</color>
<!-- Dark Theme -->
<color name="colorAccentDark">#3399FF</color>
@ -50,7 +50,7 @@
<color name="colorAccentApple">#48E484</color>
<color name="colorOnSecondaryApple">@color/md_black_1000</color>
<color name="rippleSecondaryColorApple">#0A48E484</color>
<color name="selectorColorApple">#8048E484</color>
<color name="selectorColorApple">#BF48E484</color>
<!-- Midnight Dusk Theme -->
<color name="colorAccentDusk">#F02475</color>
@ -61,7 +61,7 @@
<color name="rippleSecondaryColorDusk">#0FF02475</color>
<color name="backgroundDusk">#16151D</color>
<color name="dialogDusk">#201F27</color>
<color name="selectorColorDusk">#80F02475</color>
<color name="selectorColorDusk">#BFF02475</color>
<!-- AMOLED Theme -->
<color name="colorAccentAmoled">#3399FF</color>
@ -74,7 +74,7 @@
<color name="rippleToolbarColorAmoled">@color/rippleColorAmoled</color>
<color name="backgroundAmoled">@color/colorAmoledPrimary</color>
<color name="dialogAmoled">@color/colorAmoledPrimary</color>
<color name="selectorColorAmoled">@color/md_blue_A200_50</color>
<color name="selectorColorAmoled">@color/md_blue_A200_75</color>
<!-- Hot Pink Theme -->
<color name="colorAccentPink">#FF3399</color>
@ -82,7 +82,7 @@
<color name="textColorSecondaryPink">@color/md_white_1000_70</color>
<color name="textColorHintPink">@color/md_white_1000_50</color>
<color name="rippleSecondaryColorPink">#0AFF3399</color>
<color name="selectorColorPink">#80FF69B4</color>
<color name="selectorColorPink">#BFFF69B4</color>
<!-- Reader Theme -->
<color name="readerColorDarkPrimary">@color/colorDarkPrimary</color>
@ -122,9 +122,11 @@
<color name="md_grey_900_75">#BF212121</color>
<color name="md_blue_A200">#448AFF</color>
<color name="md_blue_A200_75">#BF448AFF</color>
<color name="md_blue_A200_50">#80448AFF</color>
<color name="md_blue_A400">#2979FF</color>
<color name="md_blue_A400_75">#BF2979FF</color>
<color name="md_blue_A400_38">#612979FF</color>
<color name="md_blue_A400_4">#0A2979FF</color>

8
app/src/main/res/values/themes.xml
View file

@ -308,8 +308,7 @@
<item name="materialAlertDialogTheme">@style/Theme.AlertDialog.Dark.MidnightDusk</item>
<!-- Custom Attributes-->
<item name="colorLibrarySelection">@color/selectorColorDark</item>
<item name="colorLibrarySelectionActive">@color/selectorColorDark</item>
<item name="colorLibrarySelectionActive">@color/selectorColorDusk</item>
</style>
<!--===============-->
@ -392,7 +391,7 @@
<item name="md_corner_radius">@dimen/dialog_radius</item>
<!-- Custom Attributes-->
<item name="colorLibrarySelection">@color/selectorColorAmoled</item>
<item name="colorLibrarySelection">?attr/colorAccent</item>
<item name="colorLibrarySelectionActive">@color/selectorColorAmoled</item>
<item name="colorFilterActive">@color/filterColorAmoled</item>
@ -421,6 +420,9 @@
<!-- Themes -->
<item name="materialAlertDialogTheme">@style/Theme.AlertDialog.Amoled.HotPink</item>
<!-- Custom Attributes-->
<item name="colorLibrarySelectionActive">@color/selectorColorPink</item>
</style>
<!--===============-->