在相对布局中限制自定义视图
restrict a custom view in a relative layout
我是 android 的新手,有点卡壳了。我正在尝试创建一个简单的绘图应用程序,它在页面顶部显示一个示例,并在其下方显示一个正方形 space。目的是展示一个字母,孩子需要练习复制它。
我在需要限制其边界的布局中包含绘图 class 时遇到问题。
这是主要布局
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:id="@+id/exampleText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.ConstraintLayout
enter code here` android:id="@+id/drawingBoard"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/exampleText">
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
这是 PaintView class
import android.app.ActionBar;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
public class PaintView extends View {
public ViewGroup.LayoutParams param;
private Path path = new Path();
private Paint brush = new Paint();
public PaintView(MainActivity context) {
super(context);
brush.setAntiAlias(true);
brush.setColor(Color.RED);
brush.setStyle(Paint.Style.STROKE);
brush.setStrokeJoin(Paint.Join.ROUND);
brush.setStrokeWidth(8f);
param = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
float pointX = event.getX();
float pointY = event.getY();
switch (event.getAction()){
case MotionEvent.ACTION_DOWN:
path.moveTo(pointX,pointY);
return true;
case MotionEvent.ACTION_MOVE:
path.lineTo(pointX,pointY);
break;
default:
return false;
}
postInvalidate();
return false;
}
@Override
protected void onDraw(Canvas canvas) {
canvas.drawPath(path,brush);
}
这是它在 Main 中的调用方式 Activity
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
PaintView paintView = new PaintView(this);
setContentView(paintView);
}
我需要将绘图板放入“drawingBoard”中。
不一定是正确的方法,但就我所知。
提前致谢
将自定义视图附加到片段。
这是一种完全不同的方法,因此您将不得不对代码进行大量更改。
另一种方法是以编程方式将视图添加到 ConstraintLayout。
在 MainActivity 中,
protected void onCreate(Bundle savedInstanceStatee) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//remove those lines.
/*
PaintView paintView = new PaintView(this);
setContentView(paintView);*/
ConstraintLayout parentLayout = (ConstraintLayout)findViewById(R.id.drawingBoard);
ConstraintSet set = new ConstraintSet();
PaintView paintView = new PaintView(this);
// set view id, else getId() returns -1
paintView.setId(View.generateViewId());
layout.addView(paintView, 0);
set.clone(parentLayout);
// connect start and end point of views, in this
case top of child to top of parent.
set.connect(paintView.getId(),
ConstraintSet.TOP,parentLayout.getId(),
ConstraintSet.TOP, 60);
// ... similarly add other constraints
set.applyTo(parentLayout);
}
在 activity 中,您仅使用绘画视图覆盖了内容视图:
setContentView(paintView);
删除该行。
改为在XML中添加PaintView
:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:id="@+id/exampleText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<!-- TODO: Replace with your package name -->
<com.example.PaintView
android:id="@+id/drawingBoard"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/exampleText" />
</androidx.constraintlayout.widget.ConstraintLayout>
使用这种方法,您必须在其构造函数中扩充自定义视图:
public class PaintView extends ConstraintLayout {
public PaintView(@NonNull Context context) {
super(context);
init();
}
public PaintView(@NonNull Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init();
}
public PaintView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
public PaintView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
init();
}
public void init() {
inflate(getContext(), R.layout.layout_product_item, this);
}
}
要与 activity 代码中的 PaintView
交互,您可以执行以下操作:
PaintView paintView = (PaintView) findViewById(R.id.drawingBoard);
我是 android 的新手,有点卡壳了。我正在尝试创建一个简单的绘图应用程序,它在页面顶部显示一个示例,并在其下方显示一个正方形 space。目的是展示一个字母,孩子需要练习复制它。
我在需要限制其边界的布局中包含绘图 class 时遇到问题。
这是主要布局
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:id="@+id/exampleText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.ConstraintLayout
enter code here` android:id="@+id/drawingBoard"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/exampleText">
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
这是 PaintView class
import android.app.ActionBar;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
public class PaintView extends View {
public ViewGroup.LayoutParams param;
private Path path = new Path();
private Paint brush = new Paint();
public PaintView(MainActivity context) {
super(context);
brush.setAntiAlias(true);
brush.setColor(Color.RED);
brush.setStyle(Paint.Style.STROKE);
brush.setStrokeJoin(Paint.Join.ROUND);
brush.setStrokeWidth(8f);
param = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
float pointX = event.getX();
float pointY = event.getY();
switch (event.getAction()){
case MotionEvent.ACTION_DOWN:
path.moveTo(pointX,pointY);
return true;
case MotionEvent.ACTION_MOVE:
path.lineTo(pointX,pointY);
break;
default:
return false;
}
postInvalidate();
return false;
}
@Override
protected void onDraw(Canvas canvas) {
canvas.drawPath(path,brush);
}
这是它在 Main 中的调用方式 Activity
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
PaintView paintView = new PaintView(this);
setContentView(paintView);
}
我需要将绘图板放入“drawingBoard”中。
不一定是正确的方法,但就我所知。
提前致谢
将自定义视图附加到片段。 这是一种完全不同的方法,因此您将不得不对代码进行大量更改。
另一种方法是以编程方式将视图添加到 ConstraintLayout。 在 MainActivity 中,
protected void onCreate(Bundle savedInstanceStatee) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//remove those lines.
/*
PaintView paintView = new PaintView(this);
setContentView(paintView);*/
ConstraintLayout parentLayout = (ConstraintLayout)findViewById(R.id.drawingBoard);
ConstraintSet set = new ConstraintSet();
PaintView paintView = new PaintView(this);
// set view id, else getId() returns -1
paintView.setId(View.generateViewId());
layout.addView(paintView, 0);
set.clone(parentLayout);
// connect start and end point of views, in this
case top of child to top of parent.
set.connect(paintView.getId(),
ConstraintSet.TOP,parentLayout.getId(),
ConstraintSet.TOP, 60);
// ... similarly add other constraints
set.applyTo(parentLayout);
}
在 activity 中,您仅使用绘画视图覆盖了内容视图:
setContentView(paintView);
删除该行。
改为在XML中添加PaintView
:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:id="@+id/exampleText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<!-- TODO: Replace with your package name -->
<com.example.PaintView
android:id="@+id/drawingBoard"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/exampleText" />
</androidx.constraintlayout.widget.ConstraintLayout>
使用这种方法,您必须在其构造函数中扩充自定义视图:
public class PaintView extends ConstraintLayout {
public PaintView(@NonNull Context context) {
super(context);
init();
}
public PaintView(@NonNull Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init();
}
public PaintView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
public PaintView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
init();
}
public void init() {
inflate(getContext(), R.layout.layout_product_item, this);
}
}
要与 activity 代码中的 PaintView
交互,您可以执行以下操作:
PaintView paintView = (PaintView) findViewById(R.id.drawingBoard);