使用Android Studio创建自定义视图 [英] Create a custom view with Android Studio
问题描述
我正在尝试在Android Studio中创建一个小视图，该视图可以将其从右拖到左.该视图将有2个按钮.
I'm trying to make a little view in Android Studio that can drag it from right to left. This view will have 2 buttons.
当您选择其中之一或在其外部按时，小菜单将再次隐藏.
And when you select one of them or press outside of it, the small menu will hide again.
我一直在搜索，但是还没有任何类似的库.我也不知道该怎么做.
I have been searching and I have not got any library that does something similar. I also have no idea how to do it.
我可以在单独的视图(布局xml)中绘制小视图，但是我不知道如何添加它以及创建要通过拖动打开或关闭的事件.
I can draw the small view in a separate view (layout xml) but I don't know how to add it and create the events to be opened or closed by dragging.
我该怎么做?
谢谢.
推荐答案
这是创建自定义可拖动抽屉的基本示例.
This is a basic example of creating a custom draggable drawer.
这些是我浏览过的参考书.
These are the references I went through.
要检测拖动/甩动手势，我使用了GestureDetectorCompat，并且 我指的是: https://developer.android.com/training/gestures/detector
To detect drag / fling gesture I have used GestureDetectorCompat, and I referred to : https://developer.android.com/training/gestures/detector
我要创建抽屉打开和关闭动画: https://youtu.be/OHcfs6rStRo
To create drawer open and close animations I referred to : https://youtu.be/OHcfs6rStRo
请注意，这是一个非常基本的示例. 您可以以此为基础来创建最终目标. 您将不得不过滤掉收到的不必要的拖动/猛击回调. 您将不得不忽略抽屉上的水龙头.
Please note that this is a very basic example. You can use this as the base to create your end goal. You will have to filter out unwanted drag / fling callbacks you receive. You will have to ignore the taps that you'll get on the drawer.
这是实现.
MainActivity.java
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_closed.xml
res/layout/activity_main_drawer_closed.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
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
res/drawable/drawer_notch.xml
<shape
android:shape="rectangle">
<corners android:radius="4dp" />
<solid android:color="@color/colorAccent" />
</shape>
app/build.gradle
app/build.gradle
android {
defaultConfig {
minSdkVersion 19
.
.
.
}
.
.
.
}
结果:
这篇关于使用Android Studio创建自定义视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
