Graphic changes to the playlist page

This commit is contained in:
CappielloAntonio 2021-08-12 10:37:05 +02:00
parent b1e2cbe68f
commit 42731aef75
5 changed files with 194 additions and 135 deletions

1
.idea/misc.xml generated
View file

@ -28,6 +28,7 @@
<entry key="app/src/main/res/layout/fragment_home.xml" value="0.2212962962962963" />
<entry key="app/src/main/res/layout/fragment_login.xml" value="0.3166496424923391" />
<entry key="app/src/main/res/layout/fragment_playlist_catalogue.xml" value="0.3229166666666667" />
<entry key="app/src/main/res/layout/fragment_playlist_page.xml" value="0.3229166666666667" />
<entry key="app/src/main/res/layout/item_home_discover_song.xml" value="0.3166496424923391" />
<entry key="app/src/main/res/layout/item_horizontal_album.xml" value="0.3166496424923391" />
<entry key="app/src/main/res/layout/item_horizontal_track.xml" value="4.0" />

View file

@ -4,12 +4,12 @@ import android.os.Parcel;
import android.os.Parcelable;
public class Playlist implements Parcelable {
public String id;
public String name;
public String primary;
public String blurHash;
public int songCount;
public int duration;
private String id;
private String name;
private String primary;
private String blurHash;
private int songCount;
private long duration;
public Playlist(com.cappielloantonio.play.subsonic.models.Playlist playlist) {
this.id = playlist.getId();
@ -40,7 +40,7 @@ public class Playlist implements Parcelable {
return songCount;
}
public int getDuration() {
public long getDuration() {
return duration;
}

View file

@ -16,6 +16,7 @@ import androidx.fragment.app.Fragment;
import androidx.lifecycle.ViewModelProvider;
import androidx.recyclerview.widget.LinearLayoutManager;
import com.bumptech.glide.load.resource.bitmap.RoundedCorners;
import com.cappielloantonio.play.App;
import com.cappielloantonio.play.R;
import com.cappielloantonio.play.adapter.SongHorizontalAdapter;
@ -25,6 +26,7 @@ import com.cappielloantonio.play.repository.QueueRepository;
import com.cappielloantonio.play.service.MusicPlayerRemote;
import com.cappielloantonio.play.ui.activity.MainActivity;
import com.cappielloantonio.play.util.DownloadUtil;
import com.cappielloantonio.play.util.MusicUtil;
import com.cappielloantonio.play.viewmodel.PlaylistPageViewModel;
import java.util.Collections;
@ -59,8 +61,8 @@ public class PlaylistPageFragment extends Fragment {
init();
initAppBar();
initBackCover();
initMusicButton();
initBackCover();
initSongsView();
return view;
@ -97,20 +99,19 @@ public class PlaylistPageFragment extends Fragment {
private void initAppBar() {
activity.setSupportActionBar(bind.animToolbar);
if (activity.getSupportActionBar() != null)
if (activity.getSupportActionBar() != null) {
activity.getSupportActionBar().setDisplayHomeAsUpEnabled(true);
activity.getSupportActionBar().setDisplayShowHomeEnabled(true);
}
bind.animToolbar.setTitle(MusicUtil.getReadableString(playlistPageViewModel.getPlaylist().getName()));
bind.playlistNameLabel.setText(playlistPageViewModel.getPlaylist().getName());
bind.playlistSongCountLabel.setText("Song count: " + playlistPageViewModel.getPlaylist().getSongCount());
bind.playlistDurationLabel.setText("Playlist duration: " + MusicUtil.getReadableDurationString(playlistPageViewModel.getPlaylist().getDuration(), false));
bind.collapsingToolbar.setTitle(playlistPageViewModel.getPlaylist().getName());
bind.animToolbar.setNavigationOnClickListener(v -> activity.navController.navigateUp());
bind.collapsingToolbar.setCollapsedTitleTextColor(getResources().getColor(R.color.titleTextColor, null));
bind.appbar.addOnOffsetChangedListener((appBarLayout, verticalOffset) -> {
if ((bind.collapsingToolbar.getHeight() + verticalOffset) < (2 * ViewCompat.getMinimumHeight(bind.collapsingToolbar))) {
bind.animToolbar.getNavigationIcon().setColorFilter(getResources().getColor(R.color.titleTextColor, null), PorterDuff.Mode.SRC_ATOP);
} else {
bind.animToolbar.getNavigationIcon().setColorFilter(getResources().getColor(R.color.white, null), PorterDuff.Mode.SRC_ATOP);
}
});
}
private void initMusicButton() {
@ -143,17 +144,19 @@ public class PlaylistPageFragment extends Fragment {
private void initBackCover() {
CustomGlideRequest.Builder
.from(requireContext(), playlistPageViewModel.getPlaylist().getPrimary(), CustomGlideRequest.ALBUM_PIC, null)
.from(requireContext(), playlistPageViewModel.getPlaylist().getPrimary(), CustomGlideRequest.PLAYLIST_PIC, null)
.build()
.into(bind.albumBackCoverImageView);
.transform(new RoundedCorners(CustomGlideRequest.CORNER_RADIUS))
.into(bind.playlistCoverImageView);
}
private void initSongsView() {
bind.playlistRecyclerView.setLayoutManager(new LinearLayoutManager(requireContext()));
bind.playlistRecyclerView.setHasFixedSize(true);
bind.songRecyclerView.setLayoutManager(new LinearLayoutManager(requireContext()));
bind.songRecyclerView.setHasFixedSize(true);
songHorizontalAdapter = new SongHorizontalAdapter(activity, requireContext(), getChildFragmentManager());
bind.playlistRecyclerView.setAdapter(songHorizontalAdapter);
bind.songRecyclerView.setAdapter(songHorizontalAdapter);
playlistPageViewModel.getPlaylistSongLiveList().observe(requireActivity(), songs -> {
songHorizontalAdapter.setItems(songs);
});

View file

@ -34,13 +34,13 @@
android:id="@+id/album_cover_image_view"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="H,1:1"
android:layout_marginLeft="64dp"
android:layout_marginRight="64dp"
android:layout_marginTop="8dp"
android:layout_marginRight="64dp"
android:layout_marginBottom="8dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintDimensionRatio="H,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
@ -50,14 +50,14 @@
android:layout_height="wrap_content"
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:paddingTop="8dp"
android:ellipsize="end"
android:maxLines="2"
android:paddingTop="8dp"
android:singleLine="false"
android:textAlignment="center"
android:text="@string/label_placeholder"
app:layout_constraintStart_toStartOf="parent"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/album_cover_image_view" />
<TextView
@ -69,10 +69,10 @@
android:layout_marginEnd="18dp"
android:ellipsize="end"
android:maxLines="1"
android:textAlignment="center"
android:text="@string/label_placeholder"
app:layout_constraintStart_toStartOf="parent"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/album_name_label" />
<TextView
@ -82,10 +82,10 @@
android:layout_height="wrap_content"
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:textAlignment="center"
android:text="@string/label_placeholder"
app:layout_constraintStart_toStartOf="parent"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/album_artist_label" />
<View
@ -151,11 +151,11 @@
android:layout_height="wrap_content"
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:textAlignment="center"
android:text="@string/label_placeholder"
android:textAlignment="center"
android:visibility="gone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/album_page_button_layout" />
<View

View file

@ -1,128 +1,183 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
<LinearLayout 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="match_parent">
android:layout_height="match_parent"
android:orientation="vertical">
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appbar"
<androidx.appcompat.widget.Toolbar
android:id="@+id/anim_toolbar"
android:layout_width="match_parent"
android:layout_height="@dimen/appbar_header_height"
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.MaterialComponents.Dark.ActionBar">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="@dimen/activity_margin_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<ImageView
android:id="@+id/album_back_cover_image_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />
<View
android:layout_width="match_parent"
android:layout_height="@dimen/appbar_header_height"
android:layout_gravity="top"
android:background="@drawable/gradient_backdrop_background_image"
android:fitsSystemWindows="true" />
<androidx.appcompat.widget.Toolbar
android:id="@+id/anim_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.MaterialComponents.Light"
app:titleTextColor="@color/titleTextColor" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:navigationIcon="@drawable/ic_arrow_back"
app:popupTheme="@style/ThemeOverlay.MaterialComponents.Light"
app:titleTextColor="@color/titleTextColor" />
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:orientation="vertical"
android:paddingTop="18dp"
android:paddingBottom="@dimen/global_padding_bottom">
android:orientation="vertical">
<View
android:id="@+id/upper_button_divider"
style="@style/Divider"
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"/>
<LinearLayout
android:id="@+id/playlist_page_button_layout"
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/playlist_info_sector"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="4dp"
android:paddingBottom="4dp">
android:clipChildren="false"
android:paddingTop="8dp">
<Button
android:id="@+id/playlist_page_play_button"
style="@style/MainButton"
<ImageView
android:id="@+id/playlist_cover_image_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginLeft="64dp"
android:layout_marginTop="8dp"
android:layout_marginRight="64dp"
android:layout_marginBottom="8dp"
app:layout_constraintDimensionRatio="H,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/playlist_name_label"
style="@style/ShowcaseTitleTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="4dp"
android:layout_weight="1"
android:backgroundTint="@color/buttonBackgroundColor"
android:padding="10dp"
android:text="Play"
android:textAllCaps="false"
app:icon="@drawable/ic_play"
app:iconGravity="textStart"
app:iconPadding="18dp"
app:iconTint="@color/darkIconColor" />
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:ellipsize="end"
android:maxLines="2"
android:paddingTop="8dp"
android:singleLine="false"
android:text="@string/label_placeholder"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playlist_cover_image_view" />
<Button
android:id="@+id/playlist_page_shuffle_button"
style="@style/MainButton"
<TextView
android:id="@+id/playlist_song_count_label"
style="@style/ShowcaseSubtitleTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_marginEnd="16dp"
android:layout_weight="1"
android:backgroundTint="@color/buttonBackgroundColor"
android:padding="10dp"
android:text="Shuffle"
android:textAllCaps="false"
app:icon="@drawable/ic_shuffle"
app:iconGravity="textStart"
app:iconPadding="18dp"
app:iconTint="@color/darkIconColor" />
</LinearLayout>
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:ellipsize="end"
android:maxLines="1"
android:text="@string/label_placeholder"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playlist_name_label" />
<View
android:id="@+id/bottom_button_divider"
style="@style/Divider"
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:layout_marginBottom="12dp"/>
<TextView
android:id="@+id/playlist_duration_label"
style="@style/ShowcaseExtraTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:text="@string/label_placeholder"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playlist_song_count_label" />
<View
android:id="@+id/upper_button_divider"
style="@style/Divider"
android:layout_marginStart="18dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="18dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playlist_duration_label" />
<LinearLayout
android:id="@+id/playlist_page_button_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="4dp"
android:paddingBottom="4dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/upper_button_divider">
<Button
android:id="@+id/playlist_page_play_button"
style="@style/MainButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="4dp"
android:layout_weight="1"
android:backgroundTint="@color/buttonBackgroundColor"
android:padding="10dp"
android:text="Play"
android:textAllCaps="false"
app:icon="@drawable/ic_play"
app:iconGravity="textStart"
app:iconPadding="18dp"
app:iconTint="@color/darkIconColor" />
<Button
android:id="@+id/playlist_page_shuffle_button"
style="@style/MainButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_marginEnd="16dp"
android:layout_weight="1"
android:backgroundTint="@color/buttonBackgroundColor"
android:padding="10dp"
android:text="Shuffle"
android:textAllCaps="false"
app:icon="@drawable/ic_shuffle"
app:iconGravity="textStart"
app:iconPadding="18dp"
app:iconTint="@color/darkIconColor" />
</LinearLayout>
<TextView
android:id="@+id/album_bio_label"
style="@style/ShowcaseExtraTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:text="@string/label_placeholder"
android:textAlignment="center"
android:visibility="gone"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playlist_page_button_layout" />
<View
android:id="@+id/bottom_button_divider"
style="@style/Divider"
android:layout_marginStart="18dp"
android:layout_marginEnd="18dp"
android:layout_marginBottom="18dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/playlist_page_button_layout" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/playlist_recycler_view"
android:id="@+id/song_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:nestedScrollingEnabled="false"
android:paddingBottom="@dimen/global_padding_bottom"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
android:paddingTop="8dp"
android:paddingBottom="@dimen/global_padding_bottom"/>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</LinearLayout>