Account switcher M3 redesign

This commit is contained in:
Grishka 2023-05-01 13:43:00 +03:00
parent 0434cda2da
commit 62074e554a
11 changed files with 250 additions and 89 deletions

View File

@ -73,4 +73,8 @@ public class AccountSession{
pushSubscriptionManager=new PushSubscriptionManager(getID());
return pushSubscriptionManager;
}
public String getFullUsername(){
return '@'+self.username+'@'+domain;
}
}

View File

@ -197,6 +197,13 @@ public class HomeFragment extends AppKitFragment implements OnBackPressedListene
throw new IllegalArgumentException();
}
public void setCurrentTab(@IdRes int tab){
if(tab==currentTab)
return;
tabBar.selectTab(tab);
onTabSelected(tab);
}
private void onTabSelected(@IdRes int tab){
Fragment newFragment=fragmentForTab(tab);
if(tab==currentTab){
@ -230,7 +237,7 @@ public class HomeFragment extends AppKitFragment implements OnBackPressedListene
for(AccountSession session:AccountSessionManager.getInstance().getLoggedInAccounts()){
options.add(session.self.displayName+"\n("+session.self.username+"@"+session.domain+")");
}
new AccountSwitcherSheet(getActivity()).show();
new AccountSwitcherSheet(getActivity(), this).show();
return true;
}
if(tab==R.id.tab_home){

View File

@ -103,7 +103,7 @@ public class AccountActivationFragment extends ToolbarFragment{
@Override
public void onToolbarNavigationClick(){
new AccountSwitcherSheet(getActivity()).show();
new AccountSwitcherSheet(getActivity(), null).show();
}
@Override

View File

@ -2,21 +2,18 @@ package org.joinmastodon.android.ui;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Context;
import android.app.ProgressDialog;
import android.content.Intent;
import android.content.res.ColorStateList;
import android.graphics.drawable.Animatable;
import android.graphics.drawable.ColorDrawable;
import android.graphics.drawable.Drawable;
import android.os.Build;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.view.WindowInsets;
import android.widget.FrameLayout;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.PopupMenu;
import android.widget.RadioButton;
import android.widget.TextView;
import org.joinmastodon.android.GlobalUserPreferences;
@ -25,14 +22,18 @@ import org.joinmastodon.android.R;
import org.joinmastodon.android.api.requests.oauth.RevokeOauthToken;
import org.joinmastodon.android.api.session.AccountSession;
import org.joinmastodon.android.api.session.AccountSessionManager;
import org.joinmastodon.android.fragments.HomeFragment;
import org.joinmastodon.android.fragments.SplashFragment;
import org.joinmastodon.android.model.Account;
import org.joinmastodon.android.ui.utils.UiUtils;
import java.util.ArrayList;
import java.util.List;
import java.util.stream.Collectors;
import androidx.annotation.DrawableRes;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.annotation.StringRes;
import androidx.recyclerview.widget.LinearLayoutManager;
import me.grishka.appkit.Nav;
import me.grishka.appkit.api.Callback;
@ -52,13 +53,15 @@ import me.grishka.appkit.views.UsableRecyclerView;
public class AccountSwitcherSheet extends BottomSheet{
private final Activity activity;
private final HomeFragment fragment;
private UsableRecyclerView list;
private List<WrappedAccount> accounts;
private ListImageLoaderWrapper imgLoader;
public AccountSwitcherSheet(@NonNull Activity activity){
public AccountSwitcherSheet(@NonNull Activity activity, @Nullable HomeFragment fragment){
super(activity);
this.activity=activity;
this.fragment=fragment;
accounts=AccountSessionManager.getInstance().getLoggedInAccounts().stream().map(WrappedAccount::new).collect(Collectors.toList());
@ -70,41 +73,42 @@ public class AccountSwitcherSheet extends BottomSheet{
MergeRecyclerAdapter adapter=new MergeRecyclerAdapter();
View handle=new View(activity);
handle.setBackgroundResource(R.drawable.bg_bottom_sheet_handle);
handle.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, V.dp(36)));
adapter.addAdapter(new SingleViewRecyclerAdapter(handle));
adapter.addAdapter(new AccountsAdapter());
AccountViewHolder holder=new AccountViewHolder();
holder.more.setVisibility(View.GONE);
holder.currentIcon.setVisibility(View.GONE);
holder.name.setText(R.string.add_account);
holder.avatar.setScaleType(ImageView.ScaleType.CENTER);
holder.avatar.setImageResource(R.drawable.ic_fluent_add_circle_24_filled);
holder.avatar.setImageTintList(ColorStateList.valueOf(UiUtils.getThemeColor(activity, android.R.attr.textColorPrimary)));
adapter.addAdapter(new ClickableSingleViewRecyclerAdapter(holder.itemView, ()->{
adapter.addAdapter(new ClickableSingleViewRecyclerAdapter(makeSimpleListItem(R.string.add_account, R.drawable.ic_add_24px), ()->{
Nav.go(activity, SplashFragment.class, null);
dismiss();
}));
adapter.addAdapter(new ClickableSingleViewRecyclerAdapter(makeSimpleListItem(R.string.log_out_all_accounts, R.drawable.ic_logout_24px), this::confirmLogOutAll));
list.setAdapter(adapter);
DividerItemDecoration divider=new DividerItemDecoration(activity, R.attr.colorPollVoted, .5f, 72, 16, DividerItemDecoration.NOT_FIRST);
divider.setDrawBelowLastItem(true);
list.addItemDecoration(divider);
FrameLayout content=new FrameLayout(activity);
content.setBackgroundResource(R.drawable.bg_bottom_sheet);
content.addView(list);
setContentView(content);
setNavigationBarBackground(new ColorDrawable(UiUtils.getThemeColor(activity, R.attr.colorWindowBackground)), !UiUtils.isDarkTheme());
setNavigationBarBackground(new ColorDrawable(UiUtils.alphaBlendColors(UiUtils.getThemeColor(activity, R.attr.colorM3Surface),
UiUtils.getThemeColor(activity, R.attr.colorM3Primary), 0.05f)), !UiUtils.isDarkTheme());
}
private void confirmLogOut(String accountID){
AccountSession session=AccountSessionManager.getInstance().getAccount(accountID);
new M3AlertDialogBuilder(activity)
.setTitle(R.string.log_out)
.setMessage(R.string.confirm_log_out)
.setMessage(activity.getString(R.string.confirm_log_out, session.getFullUsername()))
.setPositiveButton(R.string.log_out, (dialog, which) -> logOut(accountID))
.setNegativeButton(R.string.cancel, null)
.show();
}
private void confirmLogOutAll(){
new M3AlertDialogBuilder(activity)
.setMessage(R.string.confirm_log_out_all_accounts)
.setPositiveButton(R.string.log_out, (dialog, which) -> logOutAll())
.setNegativeButton(R.string.cancel, null)
.show();
}
private void logOut(String accountID){
AccountSession session=AccountSessionManager.getInstance().getAccount(accountID);
new RevokeOauthToken(session.app.clientId, session.app.clientSecret, session.token.accessToken)
@ -123,6 +127,41 @@ public class AccountSwitcherSheet extends BottomSheet{
.exec(accountID);
}
private void logOutAll(){
final ProgressDialog progress=new ProgressDialog(activity);
progress.setMessage(activity.getString(R.string.loading));
progress.setCancelable(false);
progress.show();
ArrayList<AccountSession> sessions=new ArrayList<>(AccountSessionManager.getInstance().getLoggedInAccounts());
for(AccountSession session:sessions){
new RevokeOauthToken(session.app.clientId, session.app.clientSecret, session.token.accessToken)
.setCallback(new Callback<>(){
@Override
public void onSuccess(Object result){
AccountSessionManager.getInstance().removeAccount(session.getID());
sessions.remove(session);
if(sessions.isEmpty()){
progress.dismiss();
Nav.goClearingStack(activity, SplashFragment.class, null);
dismiss();
}
}
@Override
public void onError(ErrorResponse error){
AccountSessionManager.getInstance().removeAccount(session.getID());
sessions.remove(session);
if(sessions.isEmpty()){
progress.dismiss();
Nav.goClearingStack(activity, SplashFragment.class, null);
dismiss();
}
}
})
.exec(session.getID());
}
}
private void onLoggedOut(String accountID){
AccountSessionManager.getInstance().removeAccount(accountID);
dismiss();
@ -143,6 +182,13 @@ public class AccountSwitcherSheet extends BottomSheet{
}
}
private View makeSimpleListItem(@StringRes int title, @DrawableRes int icon){
TextView tv=(TextView) activity.getLayoutInflater().inflate(R.layout.item_text_with_icon, list, false);
tv.setText(title);
tv.setCompoundDrawablesRelativeWithIntrinsicBounds(icon, 0, 0, 0);
return tv;
}
private class AccountsAdapter extends UsableRecyclerView.Adapter<AccountViewHolder> implements ImageLoaderRecyclerAdapter{
public AccountsAdapter(){
super(imgLoader);
@ -176,45 +222,27 @@ public class AccountSwitcherSheet extends BottomSheet{
}
}
private class AccountViewHolder extends BindableViewHolder<AccountSession> implements ImageLoaderViewHolder, UsableRecyclerView.Clickable{
private final TextView name;
private class AccountViewHolder extends BindableViewHolder<AccountSession> implements ImageLoaderViewHolder, UsableRecyclerView.Clickable, UsableRecyclerView.LongClickable{
private final TextView name, username;
private final ImageView avatar;
private final ImageButton more;
private final View currentIcon;
private final PopupMenu menu;
private final RadioButton radioButton;
public AccountViewHolder(){
super(activity, R.layout.item_account_switcher, list);
name=findViewById(R.id.name);
username=findViewById(R.id.username);
radioButton=findViewById(R.id.radiobtn);
avatar=findViewById(R.id.avatar);
more=findViewById(R.id.more);
currentIcon=findViewById(R.id.current);
avatar.setOutlineProvider(OutlineProviders.roundedRect(12));
avatar.setOutlineProvider(OutlineProviders.roundedRect(OutlineProviders.RADIUS_MEDIUM));
avatar.setClipToOutline(true);
menu=new PopupMenu(activity, more);
menu.inflate(R.menu.account_switcher);
menu.setOnMenuItemClickListener(item1 -> {
confirmLogOut(item.getID());
return true;
});
more.setOnClickListener(v->menu.show());
}
@SuppressLint("SetTextI18n")
@Override
public void onBind(AccountSession item){
name.setText("@"+item.self.username+"@"+item.domain);
if(AccountSessionManager.getInstance().getLastActiveAccountID().equals(item.getID())){
more.setVisibility(View.GONE);
currentIcon.setVisibility(View.VISIBLE);
}else{
more.setVisibility(View.VISIBLE);
currentIcon.setVisibility(View.GONE);
}
menu.getMenu().findItem(R.id.log_out).setTitle(activity.getString(R.string.log_out_account, "@"+item.self.username));
UiUtils.enablePopupMenuIcons(activity, menu);
name.setText(item.self.displayName);
username.setText(item.getFullUsername());
radioButton.setChecked(AccountSessionManager.getInstance().getLastActiveAccountID().equals(item.getID()));
}
@Override
@ -231,10 +259,23 @@ public class AccountSwitcherSheet extends BottomSheet{
@Override
public void onClick(){
if(AccountSessionManager.getInstance().getLastActiveAccountID().equals(item.getID())){
dismiss();
if(fragment!=null){
fragment.setCurrentTab(R.id.tab_profile);
}
return;
}
AccountSessionManager.getInstance().setLastActiveAccountID(item.getID());
activity.finish();
activity.startActivity(new Intent(activity, MainActivity.class));
}
@Override
public boolean onLongClick(){
confirmLogOut(item.getID());
return true;
}
}
private static class WrappedAccount{

View File

@ -8,7 +8,15 @@ import android.view.ViewOutlineProvider;
import me.grishka.appkit.utils.V;
public class OutlineProviders{
private static SparseArray<ViewOutlineProvider> roundedRects=new SparseArray<>();
private static final SparseArray<ViewOutlineProvider> roundedRects=new SparseArray<>();
private static final SparseArray<ViewOutlineProvider> topRoundedRects=new SparseArray<>();
private static final SparseArray<ViewOutlineProvider> endRoundedRects=new SparseArray<>();
public static final int RADIUS_XSMALL=4;
public static final int RADIUS_SMALL=8;
public static final int RADIUS_MEDIUM=12;
public static final int RADIUS_LARGE=16;
public static final int RADIUS_XLARGE=28;
private OutlineProviders(){
//no instance
@ -37,6 +45,24 @@ public class OutlineProviders{
return provider;
}
public static ViewOutlineProvider topRoundedRect(int dp){
ViewOutlineProvider provider=topRoundedRects.get(dp);
if(provider!=null)
return provider;
provider=new TopRoundRectOutlineProvider(V.dp(dp));
topRoundedRects.put(dp, provider);
return provider;
}
public static ViewOutlineProvider endRoundedRect(int dp){
ViewOutlineProvider provider=endRoundedRects.get(dp);
if(provider!=null)
return provider;
provider=new EndRoundRectOutlineProvider(V.dp(dp));
endRoundedRects.put(dp, provider);
return provider;
}
private static class RoundRectOutlineProvider extends ViewOutlineProvider{
private final int radius;
@ -49,4 +75,34 @@ public class OutlineProviders{
outline.setRoundRect(0, 0, view.getWidth(), view.getHeight(), radius);
}
}
private static class TopRoundRectOutlineProvider extends ViewOutlineProvider{
private final int radius;
private TopRoundRectOutlineProvider(int radius){
this.radius=radius;
}
@Override
public void getOutline(View view, Outline outline){
outline.setRoundRect(0, 0, view.getWidth(), view.getHeight()+radius, radius);
}
}
private static class EndRoundRectOutlineProvider extends ViewOutlineProvider{
private final int radius;
private EndRoundRectOutlineProvider(int radius){
this.radius=radius;
}
@Override
public void getOutline(View view, Outline outline){
if(view.getLayoutDirection()==View.LAYOUT_DIRECTION_RTL){
outline.setRoundRect(-radius, 0, view.getWidth(), view.getHeight(), radius);
}else{
outline.setRoundRect(0, 0, view.getWidth()+radius, view.getHeight(), radius);
}
}
}
}

View File

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="@android:color/white"
android:pathData="M5,21Q4.175,21 3.587,20.413Q3,19.825 3,19V5Q3,4.175 3.587,3.587Q4.175,3 5,3H12V5H5Q5,5 5,5Q5,5 5,5V19Q5,19 5,19Q5,19 5,19H12V21ZM16,17 L14.625,15.55 17.175,13H9V11H17.175L14.625,8.45L16,7L21,12Z"/>
</vector>

View File

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="@android:color/white"
android:pathData="M12,21 L7.5,16.5 8.95,15.05 12,18.1 15.05,15.05 16.5,16.5ZM8.95,9.05 L7.5,7.6 12,3.1 16.5,7.6 15.05,9.05 12,6Z"/>
</vector>

View File

@ -1,44 +1,60 @@
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="48dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:layout_height="72dp"
android:gravity="center_vertical">
<ImageView
android:id="@+id/avatar"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_margin="16dp"
android:layout_alignParentStart="true"
android:importantForAccessibility="no"/>
<FrameLayout
android:id="@+id/radiobtn_wrap"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentEnd="true"
android:layout_marginTop="16dp"
android:layout_marginBottom="16dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="8dp">
<RadioButton
android:id="@+id/radiobtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:minWidth="0dp"
android:minHeight="0dp"/>
</FrameLayout>
<TextView
android:id="@+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginStart="24dp"
android:textSize="16dp"
android:textColor="?android:textColorPrimary"
android:layout_width="match_parent"
android:layout_height="24dp"
android:layout_marginTop="14dp"
android:layout_toEndOf="@id/avatar"
android:layout_toStartOf="@id/radiobtn_wrap"
android:textAppearance="@style/m3_body_large"
android:textColor="?colorM3OnSurface"
android:gravity="center_vertical"
android:singleLine="true"
android:ellipsize="end"/>
<TextView
android:id="@+id/username"
android:layout_width="match_parent"
android:layout_height="20dp"
android:layout_below="@id/name"
android:layout_toEndOf="@id/avatar"
android:layout_toStartOf="@id/radiobtn_wrap"
android:textColor="?colorM3OnSurfaceVariant"
android:textAppearance="@style/m3_body_medium"
android:singleLine="true"
android:gravity="center_vertical"
android:ellipsize="end"/>
<View
android:id="@+id/current"
android:layout_width="24dp"
android:layout_height="24dp"
android:background="@drawable/ic_fluent_checkmark_24_filled"
android:backgroundTint="?android:textColorSecondary"
android:contentDescription="@string/current_account"/>
<ImageButton
android:id="@+id/more"
android:layout_width="24dp"
android:layout_height="24dp"
android:src="@drawable/ic_fluent_more_vertical_24_regular"
android:tint="?android:textColorSecondary"
android:contentDescription="@string/more_options"
android:background="?android:selectableItemBackgroundBorderless"/>
</LinearLayout>
</RelativeLayout>

View File

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="56dp"
android:gravity="center_vertical"
android:textColor="?colorM3OnSurface"
android:textAppearance="@style/m3_body_large"
android:singleLine="true"
android:ellipsize="end"
android:paddingLeft="24dp"
android:paddingRight="24dp"
android:drawablePadding="24dp"
android:drawableTint="?colorM3OnSurfaceVariant"
tools:text="List Item"/>

View File

@ -91,13 +91,15 @@
android:layout_gravity="center"
android:scaleType="centerCrop"
android:src="@null"/>
<View
android:layout_width="16dp"
android:layout_height="16dp"
<ImageView
android:layout_width="8dp"
android:layout_height="24dp"
android:layout_gravity="center"
android:layout_marginEnd="-20dp"
android:backgroundTint="?android:colorPrimary"
android:background="@drawable/ic_fluent_chevron_up_down_16_regular"/>
android:layout_marginStart="24dp"
android:importantForAccessibility="no"
android:scaleType="center"
android:tint="?colorM3OnSurfaceVariant"
android:src="@drawable/ic_unfold_more_24px"/>
</FrameLayout>
</org.joinmastodon.android.ui.views.TabBar>

View File

@ -133,7 +133,7 @@
<string name="notification_channel_audio_player">Audio playback</string>
<string name="play">Play</string>
<string name="pause">Pause</string>
<string name="log_out">Sign out</string>
<string name="log_out">Log out</string>
<string name="add_account">Add account</string>
<string name="search_hint">Search</string>
<string name="hashtags">Hashtags</string>
@ -267,7 +267,7 @@
<string name="settings_clear_cache">Clear media cache</string>
<string name="settings_app_version">Mastodon for Android v%1$s (%2$d)</string>
<string name="media_cache_cleared">Media cache cleared</string>
<string name="confirm_log_out">Are you sure you want to sign out?</string>
<string name="confirm_log_out">Log out of %s?</string>
<string name="sensitive_content_explain">The author marked this media as sensitive.</string>
<string name="media_hidden">Tap to reveal</string>
<string name="avatar_description">Go to %s\'s profile</string>
@ -453,4 +453,6 @@
<string name="welcome_paragraph2"><![CDATA[Every Mastodon account is hosted on a server — each with its own values, rules, & admins. No matter which one you pick, you can follow and interact with people on any server.]]></string>
<string name="opening_link">Opening link…</string>
<string name="link_not_supported">This link is not supported in the app</string>
<string name="log_out_all_accounts">Log out of all accounts</string>
<string name="confirm_log_out_all_accounts">Log out of all accounts?</string>
</resources>