Cleans up the elevation transition for the search bar on the homescreen
Jeff Boek
parent
3079af1d36
commit
9e76498eed
|
|
@ -11,6 +11,7 @@ import android.transition.TransitionInflater
|
|||
import android.view.LayoutInflater
|
||||
import android.view.View
|
||||
import android.view.ViewGroup
|
||||
import android.view.ViewOutlineProvider
|
||||
import androidx.core.view.ViewCompat
|
||||
import androidx.fragment.app.Fragment
|
||||
import androidx.navigation.Navigation
|
||||
|
|
@ -35,15 +36,10 @@ class HomeFragment : Fragment() {
|
|||
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
|
||||
super.onViewCreated(view, savedInstanceState)
|
||||
|
||||
// Hide buttons that aren't used yet to prevent confusion
|
||||
// menuButton.visibility = View.GONE
|
||||
// privateBrowsingButton.visibility = View.GONE
|
||||
|
||||
val searchIcon = requireComponents.search.searchEngineManager.getDefaultSearchEngine(requireContext()).let {
|
||||
BitmapDrawable(resources, it.icon)
|
||||
}
|
||||
|
||||
toolbar_wrapper.clipToOutline = false
|
||||
toolbar.setCompoundDrawablesWithIntrinsicBounds(searchIcon, null, null, null)
|
||||
toolbar.compoundDrawablePadding = (12f * Resources.getSystem().displayMetrics.density).roundToInt()
|
||||
toolbar.setOnClickListener { it ->
|
||||
|
|
|
|||
|
|
@ -3,10 +3,10 @@
|
|||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
<shape xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<solid android:color="#FFFFFF"/>
|
||||
<solid android:color="@color/searchDarkBackground"/>
|
||||
|
||||
<stroke android:width="1dp"
|
||||
android:color="@color/searchStroke"/>
|
||||
android:color="@color/searchStrokeAlternative"/>
|
||||
|
||||
<corners android:bottomRightRadius="8dp"
|
||||
android:bottomLeftRadius="8dp"
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
<shape xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<solid android:color="@color/searchDarkBackgroundAlternative"/>
|
||||
|
||||
<corners android:bottomRightRadius="8dp"
|
||||
android:bottomLeftRadius="8dp"
|
||||
android:topLeftRadius="8dp"
|
||||
android:topRightRadius="8dp"/>
|
||||
</shape>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
<shape xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<solid android:color="#FFFFFF"/>
|
||||
|
||||
<stroke android:width="1dp"
|
||||
android:color="@color/searchStroke"/>
|
||||
|
||||
<corners android:radius="8dp"/>
|
||||
</shape>
|
||||
|
|
@ -8,7 +8,6 @@
|
|||
android:id="@+id/homeLayout"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="match_parent"
|
||||
android:clipToPadding="false"
|
||||
app:layoutDescription="@xml/home_scene"
|
||||
tools:context=".home.HomeFragment">
|
||||
|
||||
|
|
@ -42,36 +41,34 @@
|
|||
app:layout_constraintTop_toBottomOf="@id/menuButton" />
|
||||
|
||||
<FrameLayout
|
||||
android:id="@+id/toolbar_wrapper"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginLeft="16dp"
|
||||
android:layout_marginTop="64dp"
|
||||
android:layout_marginRight="16dp"
|
||||
android:background="@drawable/home_search_background"
|
||||
android:clipToPadding="false"
|
||||
android:elevation="5dp"
|
||||
android:outlineProvider="paddedBounds"
|
||||
app:layout_constraintEnd_toEndOf="parent"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toBottomOf="@id/wordmark">
|
||||
android:id="@+id/toolbar_wrapper"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginLeft="16dp"
|
||||
android:layout_marginTop="64dp"
|
||||
android:layout_marginRight="16dp"
|
||||
android:elevation="@dimen/toolbar_elevation"
|
||||
android:background="@drawable/home_search_background_light"
|
||||
app:layout_constraintEnd_toEndOf="parent"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toBottomOf="@id/wordmark">
|
||||
|
||||
<TextView
|
||||
android:id="@+id/toolbar"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:paddingStart="12sp"
|
||||
android:paddingEnd="12sp"
|
||||
android:paddingTop="16sp"
|
||||
android:paddingBottom="16sp"
|
||||
android:drawablePadding="12sp"
|
||||
android:clickable="true"
|
||||
android:focusable="true"
|
||||
android:gravity="center_vertical"
|
||||
android:text="@string/search_hint"
|
||||
android:textColor="@color/searchText"
|
||||
android:textSize="14sp"
|
||||
android:transitionName="firstTransitionName" />
|
||||
android:id="@+id/toolbar"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:paddingStart="12sp"
|
||||
android:paddingEnd="12sp"
|
||||
android:paddingTop="16sp"
|
||||
android:paddingBottom="16sp"
|
||||
android:drawablePadding="12sp"
|
||||
android:clickable="true"
|
||||
android:focusable="true"
|
||||
android:gravity="center_vertical"
|
||||
android:text="@string/search_hint"
|
||||
android:textColor="@color/searchText"
|
||||
android:textSize="14sp"
|
||||
android:transitionName="firstTransitionName"/>
|
||||
</FrameLayout>
|
||||
|
||||
</androidx.constraintlayout.motion.widget.MotionLayout>
|
||||
|
|
@ -17,7 +17,7 @@
|
|||
android:layout_marginLeft="16dp"
|
||||
android:layout_marginTop="24dp"
|
||||
android:layout_marginRight="16dp"
|
||||
android:background="@drawable/home_search_background"
|
||||
android:background="@drawable/home_search_background_light"
|
||||
android:clipToPadding="false"
|
||||
android:elevation="5dp"
|
||||
android:outlineProvider="paddedBounds"
|
||||
|
|
|
|||
|
|
@ -7,7 +7,10 @@
|
|||
<color name="colorPrimaryDark">#00574B</color>
|
||||
<color name="colorAccent">#D81B60</color>
|
||||
|
||||
<color name="searchStroke">#331b215e</color>
|
||||
<color name="searchDarkBackground">#F2F2F5</color>
|
||||
<color name="searchDarkBackgroundAlternative">#E9E9ED</color>
|
||||
<color name="searchStroke">#c5c8d7</color>
|
||||
<color name="searchStrokeAlternative">#0A202340</color>
|
||||
<color name="searchText">#0C0C0D</color>
|
||||
<color name="offwhite">#f9f9fa</color>
|
||||
<color name="icons">#0C0C0D</color>
|
||||
|
|
|
|||
|
|
@ -6,4 +6,5 @@
|
|||
<dimen name="glyph_button_height">48dp</dimen>
|
||||
<dimen name="glyph_button_width">48dp</dimen>
|
||||
<dimen name="mozac_browser_menu_corner_radius">14dp</dimen>
|
||||
<dimen name="toolbar_elevation">7dp</dimen>
|
||||
</resources>
|
||||
|
|
@ -47,6 +47,17 @@
|
|||
motion:target="@id/privateBrowsingButton"
|
||||
motion:framePosition="90"
|
||||
android:alpha="0" />
|
||||
|
||||
<KeyAttribute
|
||||
motion:target="@id/toolbar_wrapper"
|
||||
motion:framePosition="0"
|
||||
android:elevation="@dimen/toolbar_elevation" />
|
||||
|
||||
<KeyAttribute
|
||||
motion:target="@id/toolbar_wrapper"
|
||||
motion:framePosition="50"
|
||||
android:elevation="0dp" />
|
||||
|
||||
</KeyFrameSet>
|
||||
</Transition>
|
||||
|
||||
|
|
@ -92,6 +103,7 @@
|
|||
android:layout_width="@dimen/glyph_button_height"
|
||||
motion:layout_constraintEnd_toStartOf="@id/menuButton"
|
||||
motion:layout_constraintTop_toTopOf="@id/menuButton"/>
|
||||
|
||||
</ConstraintSet>
|
||||
|
||||
</MotionScene>
|
||||
Loading…
Reference in New Issue