ใครสามารถบอกวิธีการวาดเส้นใน Android บางทีด้วยตัวอย่าง?
ใครสามารถบอกวิธีการวาดเส้นใน Android บางทีด้วยตัวอย่าง?
คำตอบ:
อันนี้วาด 2 บรรทัดซึ่งเป็นรูปกากบาทที่ด้านซ้ายบนของหน้าจอ:
DrawView.java
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.view.View;
public class DrawView extends View {
Paint paint = new Paint();
private void init() {
paint.setColor(Color.BLACK);
}
public DrawView(Context context) {
super(context);
init();
}
public DrawView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public DrawView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
@Override
public void onDraw(Canvas canvas) {
canvas.drawLine(0, 0, 20, 20, paint);
canvas.drawLine(20, 0, 0, 20, paint);
}
}
กิจกรรมที่จะเริ่ม:
StartDraw.java
import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
public class StartDraw extends Activity {
DrawView drawView;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
drawView = new DrawView(this);
drawView.setBackgroundColor(Color.WHITE);
setContentView(drawView);
}
}
หากคุณต้องการให้มีเส้นเรียบง่ายในเค้าโครงของคุณเพื่อแยกสองมุมมองคุณสามารถใช้มุมมองทั่วไปที่มีความสูงและความกว้างที่คุณต้องการให้เส้นมีและสีพื้นหลังที่กำหนด
ด้วยวิธีนี้คุณไม่จำเป็นต้องแทนที่มุมมองหรือใช้ Canvas ด้วยตัวคุณเองเพียงแค่ทำความสะอาดและเพิ่มบรรทัดใน xml
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@android:color/black" />
ตัวอย่างรหัสที่ฉันให้จะสร้างบรรทัดที่เติมหน้าจอให้เต็มความกว้างและมีความสูงหนึ่ง dp
หากคุณมีปัญหากับการวาดเส้นบนหน้าจอขนาดเล็กให้พิจารณาเปลี่ยนความสูงของบรรทัดเป็น px ปัญหาคือบนหน้าจอ ldpi เส้นจะมีความสูง 0.75 พิกเซล บางครั้งสิ่งนี้อาจส่งผลในการปัดเศษที่ทำให้บรรทัดหายไป หากนี่เป็นปัญหาสำหรับเลย์เอาต์ของคุณกำหนดความกว้างของบรรทัดไฟล์ ressource และสร้างไฟล์ ressource แยกต่างหากสำหรับหน้าจอขนาดเล็กที่ตั้งค่าเป็น 1px แทนที่จะเป็น 1dp
วิธีการนี้ใช้งานได้เฉพาะเมื่อคุณต้องการเส้นแนวนอนหรือแนวตั้งที่ใช้ในการแบ่งองค์ประกอบเค้าโครง หากคุณต้องการบรรลุสิ่งที่เป็นรูปกากบาทที่ถูกวาดเข้าไปในรูปภาพแนวทางของฉันจะไม่ทำงาน
มีสองวิธีหลักที่คุณสามารถวาดเส้นได้โดยใช้Canvasหรือโดยใช้Viewหรือโดยการใช้
จากเอกสารที่เราเห็นว่าเราจำเป็นต้องใช้วิธีการดังต่อไปนี้:
drawLine (float startX, float startY, float stopX, float stopY, Paint paint)
นี่คือภาพ:

Paintวัตถุเพียงแค่บอกว่าCanvasสิ่งที่สีในการวาดเส้นกว้างมันควรจะเป็นและอื่น ๆ
นี่คือตัวอย่างรหัสบางส่วน:
private Paint paint = new Paint();
....
private void init() {
paint.setColor(Color.BLACK);
paint.setStrokeWidth(1f);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
startX = 20;
startY = 100;
stopX = 140;
stopY = 30;
canvas.drawLine(startX, startY, stopX, stopY, paint);
}
หากคุณต้องการเพียงเส้นแนวนอนหรือแนวตั้งเท่านั้นวิธีที่ง่ายที่สุดคือการใช้ a Viewในไฟล์เลย์เอาต์ xml ของคุณ คุณจะทำสิ่งนี้:
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@android:color/black" />
นี่คือรูปภาพที่มีสองบรรทัด (หนึ่งแนวนอนและแนวตั้งหนึ่งแนว) เพื่อแสดงว่ามันจะเป็นอย่างไร:

และนี่คือเค้าโครง xml ที่สมบูรณ์สำหรับสิ่งนั้น:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="TextView1 in vertical linear layout" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@android:color/black" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="TextView2 in vertical linear layout" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="100dp"
android:layout_height="100dp"
android:padding="10dp"
android:text="TextView3 in horizontal linear layout" />
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="@android:color/black" />
<TextView
android:layout_width="100dp"
android:layout_height="100dp"
android:padding="10dp"
android:text="TextView4 in horizontal linear layout" />
</LinearLayout>
</LinearLayout>
onDraw()อยู่ให้ล้อมรอบรหัสการวาดของคุณด้วยif (someCondition) { draw... }ทำsomeCondition = falseและเรียกinvalidate()ใช้มุมมองของคุณ มันจะวาดมุมมองใหม่โดยไม่มีบรรทัด
คุณสามารถวาดเส้นตรงหลายเส้นในมุมมองโดยใช้ตัวอย่างการทาสีนิ้วซึ่งอยู่ใน android นักพัฒนา ลิงก์ตัวอย่าง
เพียงแค่แสดงความคิดเห็น: mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2);
คุณจะสามารถวาดเส้นตรง
import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Point;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.ImageView;
public class JoinPointsActivity extends Activity {
/** Called when the activity is first created. */
Paint mPaint;
float Mx1,My1;
float x,y;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// setContentView(R.layout.main);
MyView view1 =new MyView(this);
view1.setBackgroundResource(R.drawable.image_0031_layer_1);
setContentView(view1);
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setDither(true);
mPaint.setColor(0xFFFF0000);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeJoin(Paint.Join.ROUND);
// mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeWidth(10);
}
public class MyView extends View {
private static final float MINP = 0.25f;
private static final float MAXP = 0.75f;
private Bitmap mBitmap;
private Canvas mCanvas;
private Path mPath;
private Paint mBitmapPaint;
public MyView(Context c) {
super(c);
mPath = new Path();
mBitmapPaint = new Paint(Paint.DITHER_FLAG);
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
}
@Override
protected void onDraw(Canvas canvas) {
canvas.drawColor(0xFFAAAAAA);
// canvas.drawLine(mX, mY, Mx1, My1, mPaint);
// canvas.drawLine(mX, mY, x, y, mPaint);
canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
canvas.drawPath(mPath, mPaint);
}
private float mX, mY;
private static final float TOUCH_TOLERANCE = 4;
private void touch_start(float x, float y) {
mPath.reset();
mPath.moveTo(x, y);
mX = x;
mY = y;
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mX);
float dy = Math.abs(y - mY);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
// mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2);
mX = x;
mY = y;
}
}
private void touch_up() {
mPath.lineTo(mX, mY);
// commit the path to our offscreen
mCanvas.drawPath(mPath, mPaint);
// kill this so we don't double draw
mPath.reset();
}
@Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
touch_start(x, y);
invalidate();
break;
case MotionEvent.ACTION_MOVE:
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
touch_up();
// Mx1=(int) event.getX();
// My1= (int) event.getY();
invalidate();
break;
}
return true;
}
}
}
package com.example.helloandroid;
import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Bundle;
import android.view.View;
public class HelloAndroid2Activity extends Activity {
/** Called when the activity is first created. */
DrawView drawView;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
drawView = new DrawView(this);
drawView.setBackgroundColor(Color.WHITE);
setContentView(drawView);
}
class DrawView extends View {
Paint paint = new Paint();
public DrawView(Context context) {
super(context);
paint.setColor(Color.BLUE);
}
@Override
public void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawLine(10, 20, 30, 40, paint);
canvas.drawLine(20, 10, 50, 20, paint);
}
}
}
สำหรับเส้นแนวนอนบนเค้าโครง:
<View
android:id="@+id/View03"
android:layout_width="fill_parent"
android:layout_height="5dip"
android:background="#0f0" />
สำหรับเส้นแนวตั้งบนเค้าโครง:
<View
android:id="@+id/View04"
android:layout_width="5dip"
android:layout_height="fill_parent"
android:background="#0f0" />
<TextView
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#c0c0c0"
android:id="@+id/your_id"
android:layout_marginTop="160dp" />
canvas.drawLine(10, 10, 90, 10, paint);
canvas.drawLine(10, 20, 90, 20, paint);
สิ่งนี้จะสร้างเส้นแนวนอนตรงหวังว่าจะช่วยได้!
คุณสามารถสร้าง drawable เช่นวงกลม, เส้น, สี่เหลี่ยมผืนผ้า ฯลฯ ผ่านรูปร่างใน xml ดังนี้:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="line" >
<solid android:color="#00000000" />
<stroke
android:width="2dp"
android:color="#808080" />
</shape>
รหัสนี้เพิ่มเส้นแนวนอนเป็นเค้าโครงเชิงเส้น
View view = new View(this);
LinearLayout.LayoutParams lpView = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, 1); // --> horizontal
view.setLayoutParams(lpView);
view.setBackgroundColor(Color.DKGRAY);
linearLayout.addView(view);
final SurfaceView surf = (SurfaceView)findViewById(R.id.surface_home);
surf.setOnTouchListener( new SurfaceView.OnTouchListener(){
private boolean moving = false;//stupid state
public boolean onTouch(View v, MotionEvent event) {
switch( event.getAction() ){
case MotionEvent.ACTION_DOWN:
final int x = (int)event.getX();
final int y = (int)event.getY();
final Rect bounds = mTiles.getBounds();
moving = bounds.intersects(x, y, x+1, y+1);
return true;
case MotionEvent.ACTION_MOVE:
if( moving ){
final int x_new = (int)event.getX();
final int y_new = (int)event.getY();
mDrawTiles.draw( new DrawLogic(){
public void draw(Rect _surface) {
mTiles.setBounds(
x_new - mDrawWidth/2,
y_new - mDrawHeight/2,
x_new + mDrawWidth/2,
y_new + mDrawHeight/2);
}
});
เพื่อปรับปรุงคำตอบที่ได้รับจาก @Janusz
ฉันเพิ่มสิ่งนี้ในสไตล์ของฉัน:
<style name="Divider">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">1dp</item>
<item name="android:background">?android:attr/listDivider</item>
</style>
จากนั้นในรูปแบบของฉันคือรหัสน้อยและอ่านง่ายขึ้น
<View style="@style/Divider"/>
หากคุณต้องการทำระยะห่างบรรทัดแนวนอนแล้วทำข้างต้น
และสำหรับเส้นแนวตั้งระหว่างสอง Views คุณต้องแทนที่ android: พารามิเตอร์ layout_width (attribute) ด้วย android: layout_height
อีกวิธีในการวาดเส้นโดยใช้โปรแกรม ImageView
import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Typeface;
import android.os.Bundle;
import android.widget.ImageView;
public class Test extends Activity {
ImageView drawingImageView;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
drawingImageView = (ImageView) this.findViewById(R.id.DrawingImageView);
Bitmap bitmap = Bitmap.createBitmap((int) getWindowManager()
.getDefaultDisplay().getWidth(), (int) getWindowManager()
.getDefaultDisplay().getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
drawingImageView.setImageBitmap(bitmap);
// Line
Paint paint = new Paint();
paint.setColor(Color.GREEN);
paint.setStrokeWidth(10);
int startx = 50;
int starty = 100;
int endx = 150;
int endy = 210;
canvas.drawLine(startx, starty, endx, endy, paint);
}
}
หากคุณทำงานกับConstraintLayoutคุณต้องกำหนดข้อ จำกัด อย่างน้อย 2 ข้อเพื่อให้บรรทัดปรากฏขึ้น แบบนี้:
<View
android:layout_width="0dp"
android:layout_height="1dp"
android:background="@android:color/black"
app:layout_constraintEnd_toEndOf="@+id/someView1"
app:layout_constraintStart_toStartOf="@+id/someView2"
app:layout_constraintTop_toBottomOf="@+id/someView3" />
แม้ว่าฉันจะนิยาม 3 ข้อ จำกัด
หรือถ้าคุณแค่ต้องการเส้น
TextView line = new TextView(this);
line.setBackgroundResource(android.R.color.holo_red_dark);
line.setHeight((int) Utility.convertDpToPixel(1,this));