XML代码
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".HomeActivity">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="350dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleTextAppearance="@android:color/transparent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="350dp"
android:contentDescription="V Gears"
android:scaleType="centerCrop"
android:src="@drawable/header_photo"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:title="V Gears"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/slogan"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary"
android:lineSpacingMultiplier="1.2"
android:padding="@dimen/app_spacing"
android:text="@string/slogan"
android:textColor="@color/colorTextInverted"
android:textSize="@dimen/section_heading_size"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/who_we_are"
style="@style/heading"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/wwr_title"
app:layout_constraintTop_toBottomOf="@+id/slogan"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<TextView
android:id="@+id/who_we_are_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="@dimen/app_spacing"
android:paddingRight="@dimen/app_spacing"
android:lineSpacingMultiplier="1.2"
android:text="@string/wwr_text"
app:layout_constraintTop_toBottomOf="@+id/who_we_are"
app:layout_constraintLeft_toLeftOf="@+id/who_we_are"
app:layout_constraintRight_toRightOf="@+id/who_we_are"/>
<TextView
android:id="@+id/popular_gears"
style="@style/heading"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/popular_gear_title"
app:layout_constraintTop_toBottomOf="@+id/who_we_are_text"
app:layout_constraintLeft_toLeftOf="@+id/who_we_are_text"
app:layout_constraintRight_toRightOf="@+id/who_we_are_text"/>
<LinearLayout
android:id="@+id/popular_gears_layout"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="@dimen/app_spacing"
android:paddingRight="@dimen/app_spacing"
app:layout_constraintTop_toBottomOf="@+id/popular_gears"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<android.support.v7.widget.CardView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/app_spacing">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="180dp"
android:src="@drawable/backpack"
android:scaleType="centerCrop"/>
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/app_spacing"
android:layout_marginLeft="@dimen/app_spacing_half">
<ImageView
android:layout_width="wrap_content"
android:layout_height="180dp"
android:src="@drawable/figureofeight"
android:scaleType="centerCrop"/>
</android.support.v7.widget.CardView>
</LinearLayout>
<ImageView
android:id="@+id/banner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/app_spacing"
android:layout_marginEnd="@dimen/app_spacing"
android:adjustViewBounds="true"
android:cropToPadding="false"
android:src="@drawable/banner"
android:scaleType="fitStart"
app:layout_constraintTop_toBottomOf="@+id/popular_gears_layout"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<TextView
android:id="@+id/other_gears"
style="@style/heading"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/other_gears_title"
app:layout_constraintTop_toBottomOf="@+id/banner"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<LinearLayout
android:id="@+id/other_gears_cards"
android:orientation="horizontal"
android:weightSum="4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="@dimen/app_spacing"
android:paddingRight="@dimen/app_spacing"
app:layout_constraintTop_toBottomOf="@+id/other_gears"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent">
<android.support.v7.widget.CardView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/app_spacing"
android:layout_marginRight="@dimen/app_spacing_half">
<ImageView
android:layout_width="wrap_content"
android:layout_height="76dp"
android:src="@drawable/rope"
android:scaleType="centerCrop"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/app_spacing"
android:layout_marginRight="@dimen/app_spacing_half">
<ImageView
android:layout_width="wrap_content"
android:layout_height="76dp"
android:src="@drawable/snowboot"
android:scaleType="centerCrop"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/app_spacing"
android:layout_marginRight="@dimen/app_spacing_half">
<ImageView
android:layout_width="wrap_content"
android:layout_height="76dp"
android:src="@drawable/seatharness"
android:scaleType="centerCrop"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/app_spacing">
<ImageView
android:layout_width="wrap_content"
android:layout_height="76dp"
android:src="@drawable/sunglass"
android:scaleType="centerCrop"/>
</android.support.v7.widget.CardView>
</LinearLayout>
<Button
android:id="@+id/view_more_gears"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="view more gears"
android:background="@drawable/button_bordered"
android:textColor="@color/colorPrimary"
android:layout_marginLeft="@dimen/app_spacing"
android:layout_marginRight="@dimen/app_spacing"
android:layout_marginBottom="@dimen/app_spacing"
app:layout_constraintTop_toBottomOf="@+id/other_gears_cards"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<TextView
android:id="@+id/get_in_touch_title"
style="@style/heading"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/get_in_touch_title"
app:layout_constraintTop_toBottomOf="@+id/view_more_gears"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<EditText
android:id="@+id/full_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="@+id/get_in_touch_title"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
</android.support.constraint.ConstraintLayout>
</android.support.v4.widget.NestedScrollView>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Hello World"
android:textSize="32dp"/>
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:elevation="6dp"
android:src="@drawable/ic_phone"
app:layout_anchor="@id/app_bar_layout"
app:layout_anchorGravity="bottom|right"
app:pressedTranslationZ="12dp"
android:layout_marginRight="16dp"/>
</android.support.design.widget.CoordinatorLayout>
格拉德尔
dependencies {
implementation fileTree(include: ['*.jar'], dir: 'libs')
implementation 'com.android.support:appcompat-v7:28.0.0'
implementation 'com.android.support.constraint:constraint-layout:1.1.3'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'com.android.support.test:runner:1.0.2'
androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
implementation 'com.android.support:design:28.0.0'
implementation 'com.android.support:cardview-v7:28.0.0'
}
