Dan Ballard pushed to branch tor-browser-140.3.0esr-15.0-1 at The Tor Project / Applications / Tor Browser Commits: 3b491f90 by clairehurst at 2025-10-02T14:17:31-07:00 fixup! [android] Modify UI/UX TB 43650 [android]: Homepage changes - - - - - 4 changed files: - mobile/android/fenix/app/src/main/java/org/mozilla/fenix/home/HomeFragment.kt - + mobile/android/fenix/app/src/main/java/org/mozilla/fenix/tor/TorHomePage.kt - mobile/android/fenix/app/src/main/res/layout/fragment_home.xml - mobile/android/fenix/app/src/main/res/values/colors.xml Changes: ===================================== mobile/android/fenix/app/src/main/java/org/mozilla/fenix/home/HomeFragment.kt ===================================== @@ -160,6 +160,8 @@ import org.mozilla.fenix.utils.allowUndo import org.mozilla.fenix.wallpapers.Wallpaper import org.mozilla.fenix.GleanMetrics.TabStrip as TabStripMetrics +import org.mozilla.fenix.components.toolbar.ToolbarPosition +import org.mozilla.fenix.tor.TorHomePage import org.mozilla.fenix.tor.UrlQuickLoadViewModel @Suppress("TooManyFunctions", "LargeClass") @@ -301,16 +303,6 @@ class HomeFragment : Fragment(), UserInteractionHandler { orientation = requireContext().resources.configuration.orientation, ) - // Splits by full stops or commas and puts the parts in different lines. - // Ignoring separators at the end of the string, it is expected - // that there are at most two parts (e.g. "Explore. Privately."). - val localBinding = binding - binding.exploreprivately.text = localBinding - .exploreprivately - .text - ?.replace(" *([.,。।]) *".toRegex(), "$1\n") - ?.trim() - components.appStore.dispatch(AppAction.ModeChange(browsingModeManager.mode)) lifecycleScope.launch(IO) { @@ -564,19 +556,8 @@ class HomeFragment : Fragment(), UserInteractionHandler { listenForMicrosurveyMessage(requireContext()) } - if (requireContext().settings().enableComposeHomepage) { - initComposeHomepage() - } else { - binding.homepageView.isVisible = false - binding.sessionControlRecyclerView.isVisible = true - sessionControlView = SessionControlView( - containerView = binding.sessionControlRecyclerView, - viewLifecycleOwner = viewLifecycleOwner, - interactor = sessionControlInteractor, - fragmentManager = parentFragmentManager, - ) - - updateSessionControlView() + binding.torHomepageView.setContent { + initComposeTorHomePageView() } disableAppBarDragging() @@ -990,6 +971,17 @@ class HomeFragment : Fragment(), UserInteractionHandler { ) } + private fun initComposeTorHomePageView() { + binding.torHomepageView.apply { + setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnViewTreeLifecycleDestroyed) + setContent { + TorHomePage( + toolBarAtTop = settings().toolbarPosition == ToolbarPosition.TOP + ) + } + } + } + private fun initComposeHomepage() { binding.sessionControlRecyclerView.isVisible = false binding.homepageView.isVisible = true ===================================== mobile/android/fenix/app/src/main/java/org/mozilla/fenix/tor/TorHomePage.kt ===================================== @@ -0,0 +1,111 @@ +package org.mozilla.fenix.tor + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll +import androidx.compose.material.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.paint +import androidx.compose.ui.geometry.Offset +import androidx.compose.ui.graphics.Brush +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.painter.BrushPainter +import androidx.compose.ui.res.colorResource +import androidx.compose.ui.res.dimensionResource +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import mozilla.components.compose.base.annotation.FlexibleWindowLightDarkPreview +import org.mozilla.fenix.R + +@Composable +@FlexibleWindowLightDarkPreview +fun TorHomePage( + toolBarAtTop: Boolean = true, +) { + Column( + modifier = Modifier + .fillMaxSize() + .padding( + top = if (toolBarAtTop) dimensionResource(R.dimen.tab_strip_height) else 0.dp, + bottom = if (!toolBarAtTop) dimensionResource(R.dimen.tab_strip_height) else 0.dp, + ) + .paint( + BrushPainter( + Brush.linearGradient( + colors = listOf( + colorResource(R.color.tor_homepage_gradient_start), + colorResource(R.color.tor_homepage_gradient_middle), + colorResource(R.color.tor_homepage_gradient_end), + ), + start = Offset(0f, Float.POSITIVE_INFINITY), + end = Offset(Float.POSITIVE_INFINITY, 0f), + ), + ), + ) + .padding( + start = 19.dp, + end = 19.dp, + ) + .verticalScroll(rememberScrollState()), + ) { + Spacer(modifier = Modifier.size(17.dp)) + Row( + modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically, + ) { + Image( + painter = painterResource(R.drawable.tor_browser_app_icon), + contentDescription = null, + Modifier.size(35.dp), + ) + Spacer(modifier = Modifier.size(6.dp)) + Text( + text = stringResource(R.string.app_name), + style = TextStyle( + fontSize = 20.sp, + color = Color(0xDEFFFFFF), + fontWeight = FontWeight.Bold, + ), + ) + } + Spacer(Modifier.weight(1f)) + Text( + // Moved from the commit 5bb3cc6b93346dabd8d46677fae7f86a8f8a4fc2 + // "[android] Modify UI/UX", and the file HomeFragment. + // Splits by full stops or commas and puts the parts in different lines. + // Ignoring separators at the end of the string, it is expected + // that there are at most two parts (e.g. "Explore. Privately."). + text = stringResource(R.string.tor_explore_privately).replace( + " *([.,。।]) *".toRegex(), + "$1\n", + ).trim(), + style = TextStyle( + color = Color(color = 0xDEFFFFFF), + fontSize = 40.sp, + textAlign = TextAlign.Start, + ), + modifier = Modifier.align(Alignment.CenterHorizontally), + ) + Spacer(Modifier.weight(1f)) + Image( + painter = painterResource( + id = R.drawable.ic_onion_pattern, + ), + contentDescription = null, Modifier.fillMaxWidth(), + ) + } + Spacer(modifier = Modifier.size(17.dp)) +} ===================================== mobile/android/fenix/app/src/main/res/layout/fragment_home.xml ===================================== @@ -52,90 +52,8 @@ app:layout_collapseParallaxMultiplier=".167"/> <!-- This value needs to be 1.67 * the wordmark parallax value as its 24dp vs 40 --> - <androidx.constraintlayout.widget.ConstraintLayout - android:id="@+id/wordmark" - android:layout_width="wrap_content" - android:layout_height="wrap_content" - android:layout_marginStart="16dp" - android:layout_marginTop="18dp" - android:layout_marginBottom="32dp" - android:clickable="false" - android:focusable="false" - android:orientation="horizontal" - app:srcCompat="@mipmap/ic_launcher_foreground" - app:layout_collapseMode="parallax" - android:contentDescription="@string/app_name" - app:layout_collapseParallaxMultiplier=".1"> - - <ImageView - android:id="@+id/wordmarkLogo" - android:layout_width="50dp" - android:layout_height="50dp" - android:adjustViewBounds="true" - android:contentDescription="@null" - app:srcCompat="@mipmap/ic_launcher_foreground" - tools:ignore="ImageContrastCheck" - app:layout_constraintBottom_toBottomOf="parent" - app:layout_constraintStart_toStartOf="parent" - app:layout_constraintTop_toTopOf="parent" - app:layout_constraintEnd_toStartOf="@id/app_name" - android:scaleX="1.5" - android:scaleY="1.5" /> - - <!-- - tor-browser#42590 - <ImageView - android:id="@+id/wordmarkText" - android:layout_width="wrap_content" - android:layout_height="@dimen/wordmark_text_height" - android:adjustViewBounds="true" - android:contentDescription="@null" - android:layout_marginTop="@dimen/wordmark_text_margin_top" - app:srcCompat="?fenixWordmarkText" /> - --> - - <TextView - android:id="@+id/app_name" - android:layout_width="wrap_content" - android:layout_height="wrap_content" - android:clickable="false" - android:focusable="false" - android:fontFamily="Roboto-Medium" - android:gravity="start" - android:importantForAccessibility="no" - android:maxLines="2" - android:paddingStart="16dp" - android:paddingEnd="16dp" - android:text="@string/app_name" - android:textColor="#DEFFFFFF" - android:textSize="20sp" - app:layout_constrainedWidth="true" - app:layout_constraintBottom_toBottomOf="parent" - app:layout_constraintEnd_toEndOf="parent" - app:layout_constraintStart_toEndOf="@id/wordmarkLogo" - app:layout_constraintTop_toTopOf="parent" /> - - </androidx.constraintlayout.widget.ConstraintLayout> - </com.google.android.material.appbar.CollapsingToolbarLayout> - <TextView - android:id="@+id/exploreprivately" - android:layout_width="wrap_content" - android:layout_height="wrap_content" - android:layout_gravity="center|center_vertical" - android:gravity="center_horizontal" - android:clickable="false" - android:ellipsize="end" - android:focusable="false" - android:importantForAccessibility="no" - android:text="@string/tor_explore_privately" - android:fontFamily="Roboto-Medium" - android:textColor="#DEFFFFFF" - android:textSize="40sp" - android:lineSpacingMultiplier="1.1" - app:layout_scrollFlags="scroll" /> - </com.google.android.material.appbar.AppBarLayout> <androidx.compose.ui.platform.ComposeView @@ -145,6 +63,11 @@ android:visibility="gone" app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior" /> + <androidx.compose.ui.platform.ComposeView + android:id="@+id/torHomepageView" + android:layout_width="match_parent" + android:layout_height="match_parent" /> + <androidx.recyclerview.widget.RecyclerView android:id="@+id/sessionControlRecyclerView" android:layout_width="match_parent" @@ -160,17 +83,6 @@ tools:itemCount="3" app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior"/> - <ImageView - android:id="@+id/onion_pattern_image" - android:layout_width="match_parent" - android:layout_height="wrap_content" - android:layout_gravity="bottom" - app:srcCompat="@drawable/ic_onion_pattern" - tools:ignore="ContentDescription" - app:layout_constraintBottom_toTopOf="@id/toolbarLayout" - app:layout_constraintEnd_toEndOf="parent" - app:layout_constraintStart_toStartOf="parent" /> - <ViewStub android:id="@+id/toolbarLayoutStub" android:layout_width="match_parent" ===================================== mobile/android/fenix/app/src/main/res/values/colors.xml ===================================== @@ -382,6 +382,11 @@ <!-- Private Mode mask icon circle fill colors --> <color name="mozac_ui_private_mode_circle_fill" tools:ignore="UnusedResources">@color/photonPurple60</color> + + <!-- TorHomepage gradient colors --> + <color name="tor_homepage_gradient_start">#7529A7</color> + <color name="tor_homepage_gradient_middle">#492E85</color> + <color name="tor_homepage_gradient_end">#383372</color> <!-- Connection Assist --> <color name="connect_button_purple">#9059FF</color> View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/commit/3b491f90... -- View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/commit/3b491f90... You're receiving this email because of your account on gitlab.torproject.org.