Android工具栏背景阴影

时间:2020-07-21 02:42:31

标签: android toolbar shadow

我要制作相同的工具栏。一切都很完美,但无法显示阴影。我设计了所有东西,但无法得到阴影。任何人都可以引导我。我在下面发布我的代码,并在下面附加图片:

layout design image

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.cardview.widget.CardView
        android:id="@+id/cvToolbar"
        style="@style/materialCardView"
        android:layout_width="match_parent"
        android:layout_height="@dimen/dp_56"
        android:layout_marginStart="@dimen/dp_8"
        android:layout_marginTop="@dimen/dp_8"
        android:layout_marginEnd="@dimen/dp_8"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <androidx.appcompat.widget.AppCompatImageView
                android:id="@+id/ivToolbarBack"
                android:layout_width="@dimen/dp_0"
                android:layout_height="wrap_content"
                android:layout_marginStart="@dimen/dp_23"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:srcCompat="@drawable/ic_arrow_back" />

            <androidx.appcompat.widget.AppCompatTextView
                android:id="@+id/tvToolbarTitle"
                style="@style/pinVerificationToolbarTextStyle"
                android:layout_width="@dimen/dp_0"
                android:layout_height="@dimen/dp_40"
                android:layout_marginStart="@dimen/dp_24"
                android:layout_marginTop="@dimen/dp_11"
                android:layout_marginEnd="@dimen/dp_8"
                android:layout_marginBottom="@dimen/dp_5"
                android:gravity="top"
                android:text="@string/pos_system"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toEndOf="@+id/ivToolbarBack"
                app:layout_constraintTop_toTopOf="parent" />

        </androidx.constraintlayout.widget.ConstraintLayout>

    </androidx.cardview.widget.CardView>

    </androidx.constraintlayout.widget.ConstraintLayout>


        <style name="pinVerificationToolbarTextStyle">
        <item name="android:textAppearance">@style/TextAppearance.Text.Regular</item>
        <item name="android:textColor">@color/colorBlack</item>
        <item name="android:textSize">22sp</item>
        <item name="android:letterSpacing">-0.01</item>
        <item name="android:textStyle">bold</item>
        <item name="fontFamily">@font/martel_sans</item>
        </style>
    
        <style name="materialCardView">
        <item name="cardBackgroundColor">@color/colorWhite</item>
        <item name="cardCornerRadius">26dp</item>
        <item name="cardElevation">1dp</item>
        <item name="elevation">1dp</item>
        <item name="android:translationZ">3dp</item>
        </style>

有人可以帮我解决吗?

3 个答案:

答案 0 :(得分:0)

您可以使用android:background="@android:drawable/dialog_holo_light_frame"来获得阴影,也可以使用任何绘图软件(例如photoshop,xd等)使背景可绘制 您可以将其作为参考Android View shadow

答案 1 :(得分:0)

只需在工具栏中添加android:elevation =“ 6dp”

答案 2 :(得分:0)

在活动代码的onCreate方法中,添加以下代码:

kotlin代码:

 <v-card class="mx-auto"> 
        <v-sheet class="pa-3" v-if="this.$store.state[this.$options.parent.fileName].search != false">
            <h2 class="component-title"> {{title}}</h2>
           
            <v-text-field v-model="search"
                          dark
                          placeholder="Search"
                          flat
                          solo-inverted
                          hide-details
                          clearable
                          class="vue-tree-simple-search"
                          clear-icon="mdi-close-circle-outline">
            </v-text-field>
             <v-checkbox v-if="caseSensitive.enabled" v-model="caseSensitive.sensitive"
                        dark
                        hide-details
                        label="Case Sensitive">
            </v-checkbox>
        </v-sheet>
        <v-card-text>
            <v-treeview :items="formData"
                        :search="search"
                        :filter="filterTreeView"
                        :open.sync="autoOpenItems">
                <template slot="label" slot-scope="{ item }">
                    <a :href="`#${item.id}`" v-if="hyperLink && custom != true" v-on:click="openDashboard(item)" :title="item.name">{{ item.name }}</a>
                    <a v-if="hyperLink && custom" v-bind:class="{ 'selected-mode': (componentId == item.id) }" v-on:click="selectionChanged(item)" :title="item.name">{{ item.name }}</a>
                    <span v-if="hyperLink == false">{{ item.name }}</span>
                </template>
                <template v-slot:prepend="{ item }">
                    <v-icon>
                        {{ files[item.file] }}
                    </v-icon>
                </template>
            </v-treeview>
        </v-card-text>
    </v-card>

java代码:

supportActionBar?.elevation = 8F

------------------------或-----------------

kotlin代码:

getSupportActionBar().setElevation(8);

java代码:

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        actionBar?.elevation = 8F
    }

在应用栏中达到8dp的海拔高度。 (添加高程将添加阴影)

您可以更改数值以达到所需的高度(阴影)