From 4f8d8f0c8d295dd9b35841e8a404c66ba4115929 Mon Sep 17 00:00:00 2001 From: Grishka Date: Fri, 7 Apr 2023 22:40:00 +0300 Subject: [PATCH] Welcome fragment redesign again # Conflicts: # mastodon/src/main/res/values/strings.xml # mastodon/src/main/res/values/styles.xml --- .../android/fragments/SplashFragment.java | 101 +++++++++---- .../src/main/res/drawable/bg_bottom_sheet.xml | 10 +- .../res/drawable/bg_bottom_sheet_handle.xml | 6 +- .../res/drawable/bg_button_m3_outlined.xml | 25 +++ .../src/main/res/drawable/splash_logo.xml | 27 ++++ .../src/main/res/layout/fragment_splash.xml | 142 ++++++++++++------ .../main/res/layout/intro_bottom_sheet.xml | 50 ++++++ mastodon/src/main/res/values/strings.xml | 19 +++ mastodon/src/main/res/values/styles.xml | 7 + 9 files changed, 303 insertions(+), 84 deletions(-) create mode 100644 mastodon/src/main/res/drawable/bg_button_m3_outlined.xml create mode 100644 mastodon/src/main/res/drawable/splash_logo.xml create mode 100644 mastodon/src/main/res/layout/intro_bottom_sheet.xml diff --git a/mastodon/src/main/java/org/joinmastodon/android/fragments/SplashFragment.java b/mastodon/src/main/java/org/joinmastodon/android/fragments/SplashFragment.java index b1104740..5359eea8 100644 --- a/mastodon/src/main/java/org/joinmastodon/android/fragments/SplashFragment.java +++ b/mastodon/src/main/java/org/joinmastodon/android/fragments/SplashFragment.java @@ -2,6 +2,7 @@ package org.joinmastodon.android.fragments; import android.graphics.Canvas; import android.graphics.Paint; +import android.graphics.drawable.ColorDrawable; import android.graphics.drawable.Drawable; import android.os.Bundle; import android.text.SpannableString; @@ -11,33 +12,46 @@ import android.view.View; import android.view.ViewGroup; import android.view.ViewTreeObserver; import android.view.WindowInsets; +import android.widget.Button; import android.widget.LinearLayout; import android.widget.TextView; +import org.joinmastodon.android.MastodonApp; import org.joinmastodon.android.R; +import org.joinmastodon.android.api.requests.instance.GetInstance; import org.joinmastodon.android.fragments.onboarding.InstanceCatalogSignupFragment; import org.joinmastodon.android.fragments.onboarding.InstanceChooserLoginFragment; +import org.joinmastodon.android.fragments.onboarding.InstanceRulesFragment; +import org.joinmastodon.android.model.Instance; +import org.joinmastodon.android.ui.InterpolatingMotionEffect; +import org.joinmastodon.android.ui.utils.UiUtils; import org.joinmastodon.android.ui.views.SizeListenerFrameLayout; +import org.parceler.Parcels; import androidx.annotation.NonNull; import androidx.annotation.Nullable; import androidx.recyclerview.widget.RecyclerView; import androidx.viewpager2.widget.ViewPager2; import me.grishka.appkit.Nav; +import me.grishka.appkit.api.Callback; +import me.grishka.appkit.api.ErrorResponse; import me.grishka.appkit.fragments.AppKitFragment; import me.grishka.appkit.utils.V; +import me.grishka.appkit.views.BottomSheet; public class SplashFragment extends AppKitFragment{ + private static final String DEFAULT_SERVER="mastodon.social"; + private SizeListenerFrameLayout contentView; private View artContainer, blueFill, greenFill; - private ViewPager2 pager; - private ViewGroup pagerDots; + private InterpolatingMotionEffect motionEffect; private View artClouds, artPlaneElephant, artRightHill, artLeftHill, artCenterHill; @Override public void onCreate(Bundle savedInstanceState){ super.onCreate(savedInstanceState); + motionEffect=new InterpolatingMotionEffect(MastodonApp.context); } @Nullable @@ -46,44 +60,25 @@ public class SplashFragment extends AppKitFragment{ contentView=(SizeListenerFrameLayout) inflater.inflate(R.layout.fragment_splash, container, false); contentView.findViewById(R.id.btn_get_started).setOnClickListener(this::onButtonClick); contentView.findViewById(R.id.btn_log_in).setOnClickListener(this::onButtonClick); + Button joinDefault=contentView.findViewById(R.id.btn_join_default_server); + joinDefault.setText(getString(R.string.join_default_server, DEFAULT_SERVER)); + joinDefault.setOnClickListener(this::onJoinDefaultServerClick); + contentView.findViewById(R.id.btn_learn_more).setOnClickListener(this::onLearnMoreClick); + artClouds=contentView.findViewById(R.id.art_clouds); artPlaneElephant=contentView.findViewById(R.id.art_plane_elephant); artRightHill=contentView.findViewById(R.id.art_right_hill); artLeftHill=contentView.findViewById(R.id.art_left_hill); artCenterHill=contentView.findViewById(R.id.art_center_hill); - pager=contentView.findViewById(R.id.pager); - pagerDots=contentView.findViewById(R.id.pager_dots); - pager.setAdapter(new PagerAdapter()); - pager.setOffscreenPageLimit(3); - pager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback(){ - @Override - public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels){ - for(int i=0;i=1 ? 1f : positionOffset)); - artPlaneElephant.setTranslationX(V.dp(101.55f)*parallaxProgress); - artLeftHill.setTranslationX(V.dp(-88)*parallaxProgress); - artLeftHill.setTranslationY(V.dp(24)*parallaxProgress); - artRightHill.setTranslationX(V.dp(-88)*parallaxProgress); - artRightHill.setTranslationY(V.dp(-24)*parallaxProgress); - artCenterHill.setTranslationX(V.dp(-40)*parallaxProgress); - } - }); artContainer=contentView.findViewById(R.id.art_container); blueFill=contentView.findViewById(R.id.blue_fill); greenFill=contentView.findViewById(R.id.green_fill); + motionEffect.addViewEffect(new InterpolatingMotionEffect.ViewEffect(contentView.findViewById(R.id.art_clouds), V.dp(-5), V.dp(5), V.dp(-5), V.dp(5))); + motionEffect.addViewEffect(new InterpolatingMotionEffect.ViewEffect(contentView.findViewById(R.id.art_right_hill), V.dp(-15), V.dp(25), V.dp(-10), V.dp(10))); + motionEffect.addViewEffect(new InterpolatingMotionEffect.ViewEffect(contentView.findViewById(R.id.art_left_hill), V.dp(-25), V.dp(15), V.dp(-15), V.dp(15))); + motionEffect.addViewEffect(new InterpolatingMotionEffect.ViewEffect(contentView.findViewById(R.id.art_center_hill), V.dp(-14), V.dp(14), V.dp(-5), V.dp(25))); + motionEffect.addViewEffect(new InterpolatingMotionEffect.ViewEffect(contentView.findViewById(R.id.art_plane_elephant), V.dp(-20), V.dp(12), V.dp(-20), V.dp(12))); contentView.setSizeListener(new SizeListenerFrameLayout.OnSizeChangedListener(){ @Override @@ -109,6 +104,38 @@ public class SplashFragment extends AppKitFragment{ Nav.go(getActivity(), isSignup ? InstanceCatalogSignupFragment.class : InstanceChooserLoginFragment.class, extras); } + private void onJoinDefaultServerClick(View v){ + new GetInstance() + .setCallback(new Callback<>(){ + @Override + public void onSuccess(Instance result){ + if(getActivity()==null) + return; + Bundle args=new Bundle(); + args.putParcelable("instance", Parcels.wrap(result)); + Nav.go(getActivity(), InstanceRulesFragment.class, args); + } + + @Override + public void onError(ErrorResponse error){ + if(getActivity()==null) + return; + error.showToast(getActivity()); + } + }) + .wrapProgress(getActivity(), R.string.loading_instance, true) + .execNoAuth(DEFAULT_SERVER); + } + + private void onLearnMoreClick(View v){ + View sheetView=getActivity().getLayoutInflater().inflate(R.layout.intro_bottom_sheet, null); + BottomSheet sheet=new BottomSheet(getActivity()); + sheet.setContentView(sheetView); + sheet.setNavigationBarBackground(new ColorDrawable(UiUtils.alphaBlendColors(UiUtils.getThemeColor(getActivity(), R.attr.colorM3Surface), + UiUtils.getThemeColor(getActivity(), R.attr.colorM3Primary), 0.05f)), !UiUtils.isDarkTheme()); + sheet.show(); + } + private void updateArtSize(int w, int h){ float scale=w/(float)V.dp(360); artContainer.setScaleX(scale); @@ -139,6 +166,18 @@ public class SplashFragment extends AppKitFragment{ return true; } + @Override + protected void onShown(){ + super.onShown(); + motionEffect.activate(); + } + + @Override + protected void onHidden(){ + super.onHidden(); + motionEffect.deactivate(); + } + private class PagerAdapter extends RecyclerView.Adapter{ @NonNull diff --git a/mastodon/src/main/res/drawable/bg_bottom_sheet.xml b/mastodon/src/main/res/drawable/bg_bottom_sheet.xml index e5b3d3ea..bf1a899e 100644 --- a/mastodon/src/main/res/drawable/bg_bottom_sheet.xml +++ b/mastodon/src/main/res/drawable/bg_bottom_sheet.xml @@ -2,8 +2,14 @@ - - + + + + + + + + \ No newline at end of file diff --git a/mastodon/src/main/res/drawable/bg_bottom_sheet_handle.xml b/mastodon/src/main/res/drawable/bg_bottom_sheet_handle.xml index 199c9cab..28dc9cb5 100644 --- a/mastodon/src/main/res/drawable/bg_bottom_sheet_handle.xml +++ b/mastodon/src/main/res/drawable/bg_bottom_sheet_handle.xml @@ -1,8 +1,8 @@ - - - + + + diff --git a/mastodon/src/main/res/drawable/bg_button_m3_outlined.xml b/mastodon/src/main/res/drawable/bg_button_m3_outlined.xml new file mode 100644 index 00000000..80709f7e --- /dev/null +++ b/mastodon/src/main/res/drawable/bg_button_m3_outlined.xml @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/mastodon/src/main/res/drawable/splash_logo.xml b/mastodon/src/main/res/drawable/splash_logo.xml new file mode 100644 index 00000000..71195de3 --- /dev/null +++ b/mastodon/src/main/res/drawable/splash_logo.xml @@ -0,0 +1,27 @@ + + + + + + + + + + + + diff --git a/mastodon/src/main/res/layout/fragment_splash.xml b/mastodon/src/main/res/layout/fragment_splash.xml index 23e7cc65..497ab5f3 100644 --- a/mastodon/src/main/res/layout/fragment_splash.xml +++ b/mastodon/src/main/res/layout/fragment_splash.xml @@ -5,7 +5,8 @@ android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" - android:clipToPadding="false"> + android:clipToPadding="false" + android:theme="@style/Theme.Mastodon.Dark"> @@ -58,7 +60,8 @@ android:layout_width="197.2dp" android:layout_height="153.61dp" android:layout_gravity="top|left" - android:layout_marginTop="294dp" + android:layout_marginTop="252dp" + android:layout_marginLeft="-44dp" android:importantForAccessibility="no" android:src="@drawable/splash_art_layer2"/> @@ -67,7 +70,8 @@ android:layout_width="400dp" android:layout_height="346dp" android:layout_gravity="top|left" - android:layout_marginTop="294dp" + android:layout_marginTop="240dp" + android:layout_marginLeft="-20dp" android:importantForAccessibility="no" android:src="@drawable/splash_art_layer3"/> @@ -86,60 +90,102 @@ android:layout_height="match_parent" android:clipToPadding="false" android:orientation="vertical"> + + - - - - - - - - - - -