如何在透明背景后面的 FloatingActionButton 中居中图像? [英] How to center image in FloatingActionButton behind transparent background?

问题描述

我有一个 FloatingActionButton，我想使用居中的图标使其透明.

I have a FloatingActionButton and I would like to make it transparent with a centered icon.

我添加了一个样式:

<style name="ButtonTransparent">
    <item name="colorAccent">@android:color/transparent</item>
</style>

到目前为止有效.FAB 变得透明了.然后我添加了 FAB :

which works so far. THe FAB got transparent. Then I added the FAB :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".activities.CameraActivity">
    <TextureView
        android:id="@+id/texture"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"/>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true">

        <ImageView
            android:id="@+id/iv_last_image"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_gravity="center_horizontal"
            android:layout_margin="10dp" />

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/btn_takepicture"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:layout_gravity="center_horizontal"
            android:layout_margin="20dp"
            android:theme="@style/ButtonTransparent"
            android:src="@drawable/selector_vector_camera_light" />

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/btn_back"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_gravity="center_horizontal"
            android:layout_margin="20dp"
            android:theme="@style/ButtonTransparent"
            android:src="@drawable/selector_vector_go_back" />
    </LinearLayout>
</RelativeLayout>

但是正如您在下面的屏幕截图中看到的那样，它没有很好地对齐.我该如何纠正?

but as you can see on the screenshot below it is not well aligned. How can I correct that?

推荐答案

图像定位正确，但背景中的阴影没有.如果你按下按钮，那就更糟了.

Image is positioned properly but the shadow in background no. If you press the button then it is even worse.

为了最小化这种效果，你可以改变 elevation 和 pressedTranslationZ

To minimaze this effect you can change elevation and pressedTranslationZ

      app:elevation="1dp"
      app:borderWidth="0dp"
      app:pressedTranslationZ="1dp"

你会得到:

这篇关于如何在透明背景后面的 FloatingActionButton 中居中图像?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！