阴影导航标签栏顶部的高程

时间:2017-12-20 12:43:06

标签: android material-design navigationbar android-elevation

我正在尝试使用“材质设计高程”在导航标签栏上创建阴影。

按照其他指南我了解到我需要:

  • 将填充放在父视图上。
  • 在Parent上使用ClipToPadding false。
  • 在子视图上声明高程。
  • 为孩子选择一个背景。

我能够使用适配器在我的回收器视图的元素中执行此操作,但我无法在我的xml活动中使用此直接。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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"
android:background="@color/neah_screen_bg_white"
tools:context="at.next.neah.screens.main.activitys.MainActivity">


<android.support.v4.view.ViewPager
android:id="@+id/main_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
app:layout_constraintBottom_toTopOf="@+id/main_navigation_bar_space"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<android.support.v4.widget.Space
android:id="@+id/main_navigation_bar_space"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="4dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="@id/main_navigation_bar"/>

<android.support.constraint.ConstraintLayout
android:id="@+id/main_navigation_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:paddingTop="4dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">


<at.next.neah.customView.SlidingTab.SlidingTabLayout
android:id="@+id/main_tabs"
android:layout_width="0dp"
android:layout_height="48dp"
android:elevation="8dp"
android:background="@color/neah_screen_bg_grey_dark"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:tabGravity="fill" />

<ImageView
android:id="@+id/main_icon_home"
android:elevation="8dp"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="11dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="11dp"
android:contentDescription="@string/icon_contentDescription"
app:layout_constraintBottom_toBottomOf="@+id/main_tabs"
app:layout_constraintEnd_toStartOf="@+id/main_icon_network"
app:layout_constraintStart_toStartOf="@+id/main_tabs"
app:layout_constraintTop_toTopOf="@+id/main_tabs"
app:srcCompat="@mipmap/img_splash_logo" />

<ImageView
android:id="@+id/main_icon_network"
android:elevation="8dp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:contentDescription="@string/icon_contentDescription"
app:layout_constraintBottom_toBottomOf="@+id/main_tabs"
app:layout_constraintEnd_toStartOf="@+id/main_icon_chat"
app:layout_constraintStart_toEndOf="@id/main_icon_home"
app:layout_constraintTop_toTopOf="@+id/main_tabs"
app:srcCompat="@drawable/ic_network_grey_28dp" />

<ImageView
android:id="@+id/main_icon_chat"
android:elevation="8dp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:contentDescription="@string/icon_contentDescription"
app:layout_constraintBottom_toBottomOf="@+id/main_tabs"
app:layout_constraintEnd_toStartOf="@+id/main_icon_notification"
app:layout_constraintStart_toEndOf="@id/main_icon_network"
app:layout_constraintTop_toTopOf="@+id/main_tabs"
app:srcCompat="@drawable/ic_chat_grey_35dp" />

<ImageView
android:id="@+id/main_icon_notification"
android:elevation="8dp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:contentDescription="@string/icon_contentDescription"
app:layout_constraintBottom_toBottomOf="@+id/main_tabs"
app:layout_constraintEnd_toStartOf="@+id/main_icon_profile"
app:layout_constraintStart_toEndOf="@id/main_icon_chat"
app:layout_constraintTop_toTopOf="@+id/main_tabs"
app:srcCompat="@drawable/ic_notifications_grey_28dp" />

<ImageView
android:id="@+id/main_icon_profile"
android:elevation="8dp"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:contentDescription="@string/icon_contentDescription"
app:layout_constraintBottom_toBottomOf="@+id/main_tabs"
app:layout_constraintEnd_toEndOf="@+id/main_tabs"
app:layout_constraintStart_toEndOf="@id/main_icon_notification"
app:layout_constraintTop_toTopOf="@+id/main_tabs"
app:srcCompat="@drawable/ic_person_grey_28dp" />

</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>

我有一个容器用于碎片 一个空间元素用于将碎片放在阴影后面 导航条填充的一种约束布局 导航栏的元素。

阴影应位于灰色背景之上且位于蓝色选择

之下

enter image description here

1 个答案:

答案 0 :(得分:1)

只需输入代码

即可
android:elevation="8dp"
android:background="@color/neah_screen_bg_grey_dark"

在Constraint Layout中工作。