使用 Android Studio 创建自定义视图

2023-12-31

我正在尝试在 Android Studio 中创建一个可以将其从右向左拖动的小视图。该视图将有 2 个按钮。

当您选择其中之一或按其外部时,小菜单将再次隐藏。

我一直在寻找,但没有任何图书馆可以做类似的事情。我也不知道该怎么做。

我可以在单独的视图(布局 xml)中绘制小视图,但我不知道如何添加它并创建要通过拖动打开或关闭的事件。

我怎样才能做到这一点?

Thanks.


这是创建自定义可拖动抽屉的基本示例。

这些是我经历过的参考资料。

为了检测拖动/猛击手势,我使用了 GestureDetectorCompat,并且 我提到:https://developer.android.com/training/gestures/ detector https://developer.android.com/training/gestures/detector

要创建抽屉打开和关闭动画,我提到:https://youtu.be/OHcfs6rStRo https://youtu.be/OHcfs6rStRo

请注意,这是一个非常基本的示例。 您可以以此为基础来创建您的最终目标。 您必须过滤掉收到的不需要的拖动/猛击回调。 你必须忽略抽屉上的水龙头。

这是实现。

MainActivity.java

import androidx.appcompat.app.AppCompatActivity;
import androidx.constraintlayout.widget.ConstraintLayout;
import androidx.constraintlayout.widget.ConstraintSet;
import androidx.core.view.GestureDetectorCompat;

import android.os.Bundle;
import android.transition.TransitionManager;
import android.view.GestureDetector;
import android.view.MotionEvent;

public class MainActivity extends AppCompatActivity {

    private boolean mIsDrawerOpened;
    private ConstraintLayout mRootConstraintLayout;
    private final ConstraintSet mDrawerClosedConstraintSet = new ConstraintSet();
    private final ConstraintSet mDrawerOpenedConstraintSet = new ConstraintSet();
    private GestureDetectorCompat mGestureDetector;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main_drawer_closed);

        // Drawer is initially closed
        mIsDrawerOpened = false;

        mRootConstraintLayout = findViewById(R.id.rootConstraintLayout);

        mDrawerClosedConstraintSet.clone(this, R.layout.activity_main_drawer_closed);
        mDrawerOpenedConstraintSet.clone(this, R.layout.activity_main_drawer_opened);

        mGestureDetector = new GestureDetectorCompat(
                getApplicationContext(),
                new GestureDetector.SimpleOnGestureListener() {

                    @Override
                    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {

                        // Drag / Fling gesture detected

                        // TODO: Recongnize unwanted drag / fling gestures and ignore them.

                        TransitionManager.beginDelayedTransition(mRootConstraintLayout);

                        // Drawer is closed?
                        if(!mIsDrawerOpened) {
                            // Open the drawer
                            mDrawerOpenedConstraintSet.applyTo(mRootConstraintLayout);
                            mIsDrawerOpened = true;
                        }

                        return true;
                    }

                    @Override
                    public boolean onSingleTapUp(MotionEvent e) {

                        // Single tap detected

                        // TODO: If user has tapped on the drawer, do not close it.

                        TransitionManager.beginDelayedTransition(mRootConstraintLayout);

                        // Drawer is opened?
                        if(mIsDrawerOpened) {
                            // Close the drawer
                            mDrawerClosedConstraintSet.applyTo(mRootConstraintLayout);
                            mIsDrawerOpened = false;
                        }

                        return true;
                    }

                    @Override
                    public boolean onDown(MotionEvent e) {
                        return true;
                    }
                }
        );
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        mGestureDetector.onTouchEvent(event);
        return super.onTouchEvent(event);
    }
}

res/layout/activity_main_drawer_close.xml

<ConstraintLayout
    android:id="@+id/rootConstraintLayout"
    android:clipChildren="false" >

    <ConstraintLayout
        android:id="@+id/drawerConstraintLayout"
        android:layout_width="152dp"
        android:layout_height="108dp"
        android:background="@color/colorPrimaryDark"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toEndOf="parent" >

        <Button
            android:id="@+id/button1"
            android:layout_width="52dp"
            android:layout_height="52dp"
            android:text="1"
            android:backgroundTint="@color/colorAccent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toStartOf="@id/button2" />

        <Button
            android:id="@+id/button2"
            android:layout_width="52dp"
            android:layout_height="52dp"
            android:text="2"
            android:backgroundTint="@color/colorAccent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toEndOf="@id/button1"
            app:layout_constraintEnd_toEndOf="parent" />

    </ConstraintLayout>

    <ImageView
        android:id="@+id/notch"
        android:layout_width="8dp"
        android:layout_height="72dp"
        android:src="@drawable/drawer_notch"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@id/drawerConstraintLayout" />

</ConstraintLayout>

res/layout/activity_main_drawer_opened.xml

<ConstraintLayout
    android:id="@+id/rootConstraintLayout" >

    <ConstraintLayout
        android:id="@+id/drawerConstraintLayout"
        android:layout_width="152dp"
        android:layout_height="108dp"
        android:background="@color/colorPrimaryDark"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent" >

        <Button
            android:id="@+id/button1"
            android:layout_width="52dp"
            android:layout_height="52dp"
            android:text="1"
            android:backgroundTint="@color/colorAccent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toStartOf="@id/button2" />

        <Button
            android:id="@+id/button2"
            android:layout_width="52dp"
            android:layout_height="52dp"
            android:text="2"
            android:backgroundTint="@color/colorAccent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toEndOf="@id/button1"
            app:layout_constraintEnd_toEndOf="parent" />

    </ConstraintLayout>

    <ImageView
        android:id="@+id/notch"
        android:layout_width="8dp"
        android:layout_height="72dp"
        android:src="@drawable/drawer_notch"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@id/drawerConstraintLayout" />

</ConstraintLayout>

res/drawable/drawer_notch.xml

<shape
    android:shape="rectangle">
    <corners android:radius="4dp" />
    <solid android:color="@color/colorAccent" />
</shape>

应用程序/build.gradle

android {
    defaultConfig {
        minSdkVersion 19
        .
        .
        .
    }
    .
    .
    .
}

Result :

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Android Studio 创建自定义视图 的相关文章

随机推荐