about: redesign ui

Completely redesign the about UI to remove its dependency on
bottomsheetdialogfragment. That object is such a hassle to deal with an
is the epitome of everything wrong with this horrible platform. This
design will enable further about extensions in the future.
This commit is contained in:
OxygenCobalt 2021-06-05 14:40:50 -06:00
parent 9aabfe2294
commit c54790e24c
No known key found for this signature in database
GPG key ID: 37DBE3621FE9AD47
12 changed files with 226 additions and 220 deletions

View file

@ -116,7 +116,7 @@ class PlaybackSessionConnector(
invalidateSessionState()
}
// --
// -- EXOPLAYER CALLBACKS ---
override fun onEvents(player: Player, events: Player.Events) {
if (events.containsAny(

View file

@ -8,10 +8,12 @@ import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.core.net.toUri
import androidx.fragment.app.Fragment
import androidx.navigation.fragment.findNavController
import com.google.android.material.bottomsheet.BottomSheetDialogFragment
import org.oxycblt.auxio.BuildConfig
import org.oxycblt.auxio.R
import org.oxycblt.auxio.databinding.DialogAboutBinding
import org.oxycblt.auxio.databinding.FragmentAboutBinding
import org.oxycblt.auxio.logD
import org.oxycblt.auxio.music.MusicStore
import org.oxycblt.auxio.ui.showToast
@ -20,19 +22,20 @@ import org.oxycblt.auxio.ui.showToast
* A [BottomSheetDialogFragment] that shows Auxio's about screen.
* @author OxygenCobalt
*/
class AboutDialog : BottomSheetDialogFragment() {
override fun getTheme() = R.style.Theme_BottomSheetFix
class AboutFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View {
val binding = DialogAboutBinding.inflate(layoutInflater)
val binding = FragmentAboutBinding.inflate(layoutInflater)
val musicStore = MusicStore.getInstance()
binding.aboutVersion.text = BuildConfig.VERSION_NAME
binding.aboutToolbar.setNavigationOnClickListener {
findNavController().navigateUp()
}
binding.aboutVersion.text = BuildConfig.VERSION_NAME
binding.aboutCode.setOnClickListener { openLinkInBrowser(LINK_CODEBASE) }
binding.aboutFaq.setOnClickListener { openLinkInBrowser(LINK_FAQ) }
binding.aboutLicenses.setOnClickListener { openLinkInBrowser(LINK_LICENSES) }

View file

@ -5,6 +5,8 @@ import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.Fragment
import androidx.navigation.fragment.findNavController
import org.oxycblt.auxio.MainFragmentDirections
import org.oxycblt.auxio.databinding.FragmentSettingsBinding
/**
@ -20,7 +22,10 @@ class SettingsFragment : Fragment() {
val binding = FragmentSettingsBinding.inflate(inflater)
binding.settingsToolbar.setOnMenuItemClickListener {
AboutDialog().show(childFragmentManager, AboutDialog.TAG)
parentFragment?.parentFragment?.findNavController()?.navigate(
MainFragmentDirections.actionShowAbout()
)
true
}

View file

@ -1,182 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".settings.AboutDialog">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:overScrollMode="never">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/colorSurface"
android:theme="@style/Theme.Neutral">
<ImageView
android:id="@+id/about_auxio_icon"
android:layout_width="@dimen/size_app_icon"
android:layout_height="@dimen/size_app_icon"
android:layout_marginTop="@dimen/spacing_medium"
android:contentDescription="@string/description_auxio_icon"
android:src="@mipmap/ic_launcher"
app:layout_constraintEnd_toStartOf="@+id/about_app_name"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/about_app_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:fontFamily="@font/inter_semibold"
android:text="@string/info_app_name"
android:textAppearance="@style/TextAppearance.MaterialComponents.Headline5"
app:layout_constraintBottom_toBottomOf="@+id/about_auxio_icon"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/about_auxio_icon"
app:layout_constraintTop_toTopOf="@+id/about_auxio_icon" />
<TextView
android:id="@+id/about_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_small"
android:paddingStart="@dimen/spacing_small"
android:paddingEnd="@dimen/spacing_small"
android:text="@string/info_app_desc"
android:textAlignment="center"
android:textAppearance="@style/TextAppearance.MaterialComponents.Body1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/about_auxio_icon" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/version_container"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:padding="@dimen/spacing_medium"
app:layout_constraintBottom_toTopOf="@+id/about_code"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/about_desc"
app:layout_constraintVertical_bias="0"
app:layout_constraintVertical_chainStyle="packed">
<ImageView
android:id="@+id/about_version_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="@string/label_version"
android:src="@drawable/ic_version"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/about_version_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:text="@string/label_version"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:layout_constraintBottom_toTopOf="@+id/about_version"
app:layout_constraintStart_toEndOf="@+id/about_version_icon"
app:layout_constraintTop_toTopOf="@+id/about_version_icon" />
<TextView
android:id="@+id/about_version"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
app:layout_constraintBottom_toBottomOf="@+id/about_version_icon"
app:layout_constraintStart_toEndOf="@+id/about_version_icon"
app:layout_constraintTop_toBottomOf="@+id/about_version_title"
tools:text="0.0.0" />
</androidx.constraintlayout.widget.ConstraintLayout>
<TextView
android:id="@+id/about_code"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/ui_ripple"
android:clickable="true"
android:drawablePadding="@dimen/spacing_medium"
android:focusable="true"
android:padding="@dimen/spacing_medium"
android:text="@string/label_code"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:drawableStartCompat="@drawable/ic_code"
app:layout_constraintBottom_toTopOf="@+id/about_faq"
app:layout_constraintTop_toBottomOf="@+id/version_container" />
<TextView
android:id="@+id/about_licenses"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/ui_ripple"
android:clickable="true"
android:drawablePadding="@dimen/spacing_medium"
android:focusable="true"
android:padding="@dimen/spacing_medium"
android:text="@string/label_licenses"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:drawableStartCompat="@drawable/ic_license"
app:layout_constraintBottom_toTopOf="@+id/about_song_count"
app:layout_constraintTop_toBottomOf="@+id/about_faq" />
<TextView
android:id="@+id/about_faq"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/ui_ripple"
android:clickable="true"
android:drawablePadding="@dimen/spacing_medium"
android:focusable="true"
android:padding="@dimen/spacing_medium"
android:text="@string/label_faq"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:drawableStartCompat="@drawable/ic_about"
app:layout_constraintBottom_toTopOf="@+id/about_licenses"
app:layout_constraintTop_toBottomOf="@+id/about_code"
tools:layout_editor_absoluteX="0dp" />
<TextView
android:id="@+id/about_song_count"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawablePadding="@dimen/spacing_medium"
android:padding="@dimen/spacing_medium"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:drawableStartCompat="@drawable/ic_song"
app:layout_constraintBottom_toTopOf="@+id/about_author"
app:layout_constraintTop_toBottomOf="@+id/about_licenses"
tools:text="Songs Loaded: 1616" />
<TextView
android:id="@+id/about_author"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawablePadding="@dimen/spacing_medium"
android:padding="@dimen/spacing_medium"
android:text="@string/label_author"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:drawableStartCompat="@drawable/ic_author"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="@+id/about_song_count" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
</layout>

View file

@ -0,0 +1,191 @@
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".settings.AboutFragment">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:background="?attr/colorSurface"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="@+id/about_toolbar"
style="@style/Toolbar.Style.Icon"
android:background="?android:attr/windowBackground"
android:elevation="@dimen/elevation_normal"
app:navigationIcon="@drawable/ic_down"
app:title="@string/label_about" />
<com.google.android.material.card.MaterialCardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="@dimen/spacing_medium"
app:cardBackgroundColor="?attr/colorSurface"
app:cardElevation="0dp"
app:strokeWidth="1dp"
app:strokeColor="@color/divider_color"
app:cardCornerRadius="0dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/about_auxio_icon"
android:layout_width="@dimen/size_app_icon"
android:layout_height="@dimen/size_app_icon"
android:layout_marginStart="@dimen/spacing_medium"
android:layout_marginTop="@dimen/spacing_medium"
android:contentDescription="@string/description_auxio_icon"
android:src="@mipmap/ic_launcher"
app:layout_constraintBottom_toTopOf="@+id/version_container"
app:layout_constraintEnd_toStartOf="@+id/about_app_name"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/about_app_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:fontFamily="@font/inter_semibold"
android:text="@string/info_app_name"
android:textAppearance="@style/TextAppearance.MaterialComponents.Headline5"
app:layout_constraintBottom_toBottomOf="@+id/about_auxio_icon"
app:layout_constraintStart_toEndOf="@+id/about_auxio_icon"
app:layout_constraintTop_toTopOf="@+id/about_auxio_icon" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/version_container"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:padding="@dimen/spacing_medium"
app:layout_constraintBottom_toTopOf="@+id/about_code"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/about_auxio_icon"
app:layout_constraintVertical_bias="0"
app:layout_constraintVertical_chainStyle="packed">
<ImageView
android:id="@+id/about_version_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="@string/label_version"
android:src="@drawable/ic_version"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/about_version_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:text="@string/label_version"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:layout_constraintBottom_toTopOf="@+id/about_version"
app:layout_constraintStart_toEndOf="@+id/about_version_icon"
app:layout_constraintTop_toTopOf="@+id/about_version_icon" />
<TextView
android:id="@+id/about_version"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/spacing_medium"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
app:layout_constraintBottom_toBottomOf="@+id/about_version_icon"
app:layout_constraintStart_toEndOf="@+id/about_version_icon"
app:layout_constraintTop_toBottomOf="@+id/about_version_title"
tools:text="0.0.0" />
</androidx.constraintlayout.widget.ConstraintLayout>
<TextView
android:id="@+id/about_code"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/ui_ripple"
android:clickable="true"
android:drawablePadding="@dimen/spacing_medium"
android:focusable="true"
android:padding="@dimen/spacing_medium"
android:text="@string/label_code"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:drawableStartCompat="@drawable/ic_code"
app:layout_constraintBottom_toTopOf="@+id/about_faq"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/version_container" />
<TextView
android:id="@+id/about_licenses"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/ui_ripple"
android:clickable="true"
android:drawablePadding="@dimen/spacing_medium"
android:focusable="true"
android:padding="@dimen/spacing_medium"
android:text="@string/label_licenses"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:drawableStartCompat="@drawable/ic_license"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/about_faq" />
<TextView
android:id="@+id/about_faq"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/ui_ripple"
android:clickable="true"
android:drawablePadding="@dimen/spacing_medium"
android:focusable="true"
android:padding="@dimen/spacing_medium"
android:text="@string/label_faq"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:drawableStartCompat="@drawable/ic_about"
app:layout_constraintBottom_toTopOf="@+id/about_licenses"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/about_code" />
<TextView
android:id="@+id/about_song_count"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawablePadding="@dimen/spacing_medium"
android:padding="@dimen/spacing_medium"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
android:theme="@style/Theme.Neutral"
app:drawableStartCompat="@drawable/ic_song"
app:layout_constraintTop_toBottomOf="@+id/about_licenses"
tools:text="Songs Loaded: 1616" />
<TextView
android:id="@+id/about_author"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawablePadding="@dimen/spacing_medium"
android:padding="@dimen/spacing_medium"
android:text="@string/label_author"
android:textAlignment="viewStart"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
app:drawableStartCompat="@drawable/ic_author"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/about_song_count" />
</androidx.constraintlayout.widget.ConstraintLayout>
</com.google.android.material.card.MaterialCardView>
</LinearLayout>
</layout>

View file

@ -31,6 +31,13 @@
app:exitAnim="@anim/anim_stationary"
app:popEnterAnim="@anim/anim_stationary"
app:popExitAnim="@anim/anim_nav_slide_down" />
<action
android:id="@+id/action_show_about"
app:destination="@id/about_fragment"
app:enterAnim="@anim/anim_nav_slide_up"
app:exitAnim="@anim/anim_stationary"
app:popEnterAnim="@anim/anim_stationary"
app:popExitAnim="@anim/anim_nav_slide_down" />
</fragment>
<fragment
android:id="@+id/playback_fragment"
@ -50,4 +57,9 @@
android:name="org.oxycblt.auxio.playback.queue.QueueFragment"
android:label="QueueFragment"
tools:layout="@layout/fragment_queue" />
<fragment
android:id="@+id/about_fragment"
android:name="org.oxycblt.auxio.settings.AboutFragment"
android:label="dialog_about"
tools:layout="@layout/fragment_about" />
</navigation>

View file

@ -7,12 +7,4 @@
<item name="android:windowLightStatusBar">false</item>
<item name="android:windowLightNavigationBar">false</item>
</style>
<style name="Theme.BottomSheetFix" parent="@style/Theme.Design.BottomSheetDialog">
<item name="android:windowIsFloating">false</item>
<item name="android:statusBarColor">@android:color/transparent</item>
<item name="android:navigationBarColor">?attr/colorSurface</item>
<item name="android:windowLightStatusBar">false</item>
<item name="bottomSheetStyle">@style/Theme.BottomSheetHeightFix</item>
</style>
</resources>

View file

@ -7,12 +7,4 @@
<item name="android:windowLightStatusBar">true</item>
<item name="android:windowLightNavigationBar">true</item>
</style>
<style name="Theme.BottomSheetFix" parent="@style/Theme.Design.BottomSheetDialog">
<item name="android:windowIsFloating">false</item>
<item name="android:statusBarColor">@android:color/transparent</item>
<item name="android:navigationBarColor">@color/background</item>
<item name="android:windowLightStatusBar">false</item>
<item name="bottomSheetStyle">@style/Theme.BottomSheetHeightFix</item>
</style>
</resources>

View file

@ -7,6 +7,7 @@
<color name="control_color">#202020</color>
<color name="nav_color">#01fafafa</color>
<!--
Base color set derived from Music Player GO.
https://github.com/enricocid/Music-Player-GO

View file

@ -35,7 +35,7 @@
<dimen name="size_scroll_thumb">48dp</dimen>
<dimen name="size_clear">32dp</dimen>
<dimen name="size_app_icon">60dp</dimen>
<dimen name="size_app_icon">50dp</dimen>
<!-- Text Size Namespace | Text Sizes -->
<dimen name="text_size_min">10sp</dimen>

View file

@ -1,5 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<resources xmlns:tools="http://schemas.android.com/tools"
tools:ignore="MissingTranslation">
<!-- Info namespace | App labels -->
<string name="info_app_desc">A simple, rational music player for android.</string>
<string name="info_channel_name">Music Playback</string>
@ -155,6 +156,7 @@
<string name="format_next_from">Next From: %s</string>
<string name="format_songs_loaded">Songs loaded: %d</string>
<plurals name="format_song_count">
<item quantity="one">%d Song</item>
<item quantity="other">%d Songs</item>

View file

@ -5,6 +5,8 @@
<!-- Template theme that handles edge-to-edge on other styles variants -->
<style name="Theme.Template" parent="Theme.Master" />
<!-- Refactor styles again to move more stuff into this -->
<!-- Base theme -->
<style name="Theme.Base" parent="Theme.Template">
<item name="android:windowBackground">?attr/colorSurface</item>
@ -205,18 +207,6 @@
<item name="android:background">@drawable/ui_small_unbounded_ripple</item>
</style>
<!-- Bottomsheet style -->
<style name="Theme.BottomSheetFix" parent="@style/Theme.Design.BottomSheetDialog">
<item name="android:windowIsFloating">false</item>
<item name="android:statusBarColor">@android:color/transparent</item>
<item name="bottomSheetStyle">@style/Theme.BottomSheetHeightFix</item>
</style>
<!-- Fix to make the bottomsheet go to full height instantly. -->
<style name="Theme.BottomSheetHeightFix" parent="Widget.Design.BottomSheet.Modal">
<item name="behavior_peekHeight">500dp</item>
</style>
<!-- Base style for the material buttons -->
<style name="Widget.MaterialComponents.Button.Base" parent="@style/Widget.MaterialComponents.Button.TextButton">
<item name="android:layout_width">0dp</item>