Android:フローティングボタンの最新バージョンの制作

UIデザインは私に問題を与えました:インターフェースの画面の右下隅に常に配置されるフローティングボタンをデザインします。
多くのブログ
を読んでください(ほとんどすべてが数年前のものです):彼らはすべてインポートしたいと言っていますこのような依存関係は「com.getbase:floatingactionbutton:1.10.1」をコンパイルすると、2021年にすでに期限切れになっていることがわかります。
何度か調べたところ、最新バージョンのFloatactionbuttonの正しい依存関係が見つかりませんでした。

突然、図のように、新しく構築されたプロジェクトに基本的なアクティビティがあることに気づきました。
ここに画像の説明を挿入します
そこで、新しいプロジェクトを作成してソースコードを調べたところ、非常に適していました。 SDKの最新バージョン。
もちろん、あらゆる種類のピットがありますが、ちなみにそれらも記録します。

最初に依存関係をインポートする必要があります:

    implementation 'com.android.support:design:28.0.0'
    implementation 'com.getbase:floatingactionbutton:1.10.1'

次に、xmlファイルを追加します。

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="16dp"
        app:srcCompat="@drawable/dui"
        app:fabSize="normal"
        app:maxImageSize="57dp" />

その中で、app:srcCompatはデフォルトボタンのアイコンを置き換えるために使用され、app:maxImageSizeはアイコンのサイズを調整するために使用されます。画像の長さと幅は同じでなければならないことに注意してください。見る。
アプリ:fabSize条件付きフローティングボタンサイズ、通常の通常サイズ、ミニミニサイズ。
android:layout_gravity:コントロールボタンの位置。

最後の質問、ボタンを他のページにフロートさせる方法、Basicプロジェクトはこれを行います。
最初にボタンインターフェイスを設計し、次にインクルードを介して基になるページを紹介します。これは完璧なソリューションです。

サンプルソースコード:

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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=".MainActivity">


    <include layout="@layout/activity_xuechang" />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="16dp"
        app:srcCompat="@drawable/dui"
        app:fabSize="normal"
        app:maxImageSize="57dp" />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center"
        android:layout_margin="16dp"
        app:fabSize="normal"
        app:maxImageSize="63dp"
        app:srcCompat="@drawable/jia" />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|left"
        android:layout_margin="16dp"
        app:srcCompat="@drawable/cuo"
        app:fabSize="normal"
        app:maxImageSize="63dp"/>


</androidx.coordinatorlayout.widget.CoordinatorLayout>

効果を確認してください:
ここに画像の説明を挿入します
イースターエッグが含まれているWeChatのパブリックアカウント「Ihave a plan」で、探索されるのを待っている、より興味深いプロジェクトとテクニックを利用できます〜
ここに画像の説明を挿入します

おすすめ

転載: blog.csdn.net/qq1198768105/article/details/114793387