編集履歴

質問編集履歴

助言をもとに書き直し

2019/01/07 11:51

投稿

tokutoku453

スコア13

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -6,15 +6,19 @@
 今現在の実装している処理だとマス目に沿って描画できずマス目が関係ない状態になっています。
+1月7日　20:47分追記
-![イメージ説明](8b6cd980d3133ff91ca7ed42931ece37.png)
+![イメージ説明](0cf67e0191b389103a18627b9c9ab690.png)
+アドバイスを元にコードを実装したところこのような結果になりました。思っていた通りにものすごく近づいたので嬉しいです！！
-こちらを一つのマス目に沿って点か線を描画できる処理を実装したいのですが他サイトや他質問を参考にしているのですが実装できていない状態です。
+ACTION_MOVEを入れて、動かしているので下の４つの線のようにマス目からずれている描画になっています。１マスなら問題ない？のですが
-また斜めに向かって描画する際もマス目に沿ってカクカク？な状態で描画できる方法を今模索中です
+３＊３だと少し見苦しいものになっているので少し修正したいと思います。やっぱり見苦しいのでACTION_MOVEを外して始点と終点をつなぐ形のほうが見やすかったりするのでしょうか？
-詳しい方のアドバイスを頂ければ嬉しいです。
 ```Drawingview
@@ -242,9 +246,21 @@
-        float x = event.getX();
+        float dx = event.getX();
-        float y = event.getY();
+        float dy = event.getY();
+        int x = (int) (dx - dx % 30) +15;
+        int y = (int) (dy - dy % 30) +15;

タグの追加

2019/01/07 11:51

投稿

tokutoku453

スコア13

test CHANGED Viewed

File without changes

test CHANGED Viewed

File without changes

内容の変更

2019/01/06 18:39

投稿

tokutoku453

スコア13

test CHANGED Viewed

	@@ -1 +1 @@
1	- dr~~awrectを応用し~~て~~ドット~~を~~打てるように~~したい
1	+ android 開発　マス目に沿って点を描画したい

test CHANGED Viewed

@@ -1,11 +1,333 @@
-drawrectを応用してドットを打てるようにしたいと思っています。
-https://teratail.com/questions/44537
-こちらの質問を応用して矩形を打てるようにしようと思っているのですが、DrawLineなどが邪魔をしているのかアプリケーションエラーでエミュレータが落ちてしまいます。
-応用方法などはあるのでしょうか？
-また、マス目を指定してドットを打てるようにしたいのですがマス目に沿って矩形を描画する方法などはあるのでしょうか？
-詳しい方アドバイスを頂ければ嬉しいです
+androidStudioを使用してお絵描きアプリを作っています。
+現在お絵描きの基本的な機能を実装しマス目を描画するところまでは実装　![イメージ説明](552488adb9dedb4aa5b06ce2dfffa24a.png)
+今躓いているところはこちらの実装したマス目に沿ってドットを描画することです。
+今現在の実装している処理だとマス目に沿って描画できずマス目が関係ない状態になっています。
+![イメージ説明](8b6cd980d3133ff91ca7ed42931ece37.png)
+こちらを一つのマス目に沿って点か線を描画できる処理を実装したいのですが他サイトや他質問を参考にしているのですが実装できていない状態です。
+また斜めに向かって描画する際もマス目に沿ってカクカク？な状態で描画できる方法を今模索中です
+詳しい方のアドバイスを頂ければ嬉しいです。
+```Drawingview
+import android.content.Context;
+import android.graphics.Canvas;
+import android.graphics.Color;
+import android.graphics.Paint;
+import android.graphics.Path;
+import android.graphics.Rect;
+import android.util.AttributeSet;
+import android.view.MotionEvent;
+import android.view.View;
+import java.util.ArrayList;
+import java.util.List;
+public class DrawingView extends View {
+    // 履歴
+    private List<DrawLine> lines;
+    // 現在、描いている線の情報
+    private Paint paint;
+    private Path path;
+    private Rect rect;
+    private Paint paint1;
+    // 線の履歴(座標＋色)
+    class DrawLine {
+        private Paint paint;
+        private Path path;
+        private Rect rect;
+        private Paint paint1;
+        DrawLine(Path path, Paint paint, Rect rect) {
+            this.paint = new Paint(paint);
+            this.path = new Path(path);
+            this.rect = new Rect(rect);
+            //this.paint1 = new Paint(paint);
+        }
+        void draw(Canvas canvas) {
+            canvas.drawPath(this.path, this.paint);
+        }
+    }
+    public DrawingView(Context context) {
+        super(context);
+    }
+    public DrawingView(Context context, AttributeSet attrs) {
+        super(context, attrs);
+        this.path = new Path();
+        this.paint = new Paint();
+        this.rect = new Rect();
+        this.paint.setStyle(Paint.Style.STROKE);
+        // this.paint.setStrokeJoin(Paint.Join.MITER);//これがあると角が丸くなる
+        this.paint.setStrokeCap(Paint.Cap.SQUARE);
+        this.paint.setAntiAlias(true);
+        this.paint.setStrokeWidth(30);
+        this.lines = new ArrayList<DrawLine>();
+    }
+    @Override
+    protected void onDraw(Canvas canvas) {
+        super.onDraw(canvas);
+        // キャンバスをクリア
+        canvas.drawColor(Color.WHITE);
+        // 履歴から線を描画
+        for (DrawLine line : this.lines) {
+            line.draw(canvas);
+        }
+        // 現在、描いている線を描画
+        canvas.drawPath(this.path, this.paint);
+        Paint paint1 = new Paint(Color.WHITE);
+        paint1.setColor(Color.BLACK);
+        paint1.setStyle(Paint.Style.STROKE);//ペン先に合わせて色が一緒に代わってしまうので保留
+        for (int i = 0; i < 101; i++) {
+        for (int j = 0; j < 101; j++) {
+         int a = 30;
+        Rect rect = new Rect(a * i, a * j, a * (i + j) - 1, a * (i + j) - 1);
+         canvas.drawRect(rect, paint1);
+        }
+    }
+}
+    @Override
+    public boolean onTouchEvent(MotionEvent event) {
+        float x = event.getX();
+        float y = event.getY();
+        switch (event.getAction()) {
+            case MotionEvent.ACTION_DOWN:
+                this.path.moveTo(x, y);
+                this.path.lineTo(x, y);
+                break;
+           // case MotionEvent.ACTION_MOVE:
+                //this.path.lineTo(x, y);　　←こちらの処理を無効化して、始点と終点の間に線を引く処理を可能にし直線を引けるようにした
+               // break;
+            case MotionEvent.ACTION_UP:
+                this.path.lineTo(x, y);
+                // 指を離したので、履歴に追加する
+               this.lines.add(new DrawLine(this.path, this.paint, this.rect));
+                // パスをリセットする
+                // これを忘れると、全ての線の色が変わってしまう
+                this.path.reset();
+                break;
+        }
+        invalidate();
+        return true;
+    }
+    public void delete() {
+        // 履歴をクリア
+        this.lines.clear();
+        // 現在の線をクリア
+        this.path.reset();
+        invalidate();
+    }
+    public void setPen(int color){
+        this.paint.setColor(color);
+    }
+    public void setStrokeWidth(float width){
+        this.paint.setStrokeWidth(width);
+    }
+}
+```

サイトのURLが間違っていたため

2019/01/06 07:22

投稿

tokutoku453

スコア13

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -1,6 +1,6 @@
 drawrectを応用してドットを打てるようにしたいと思っています。
-https://teratail.com/questions/4453
+https://teratail.com/questions/44537
 こちらの質問を応用して矩形を打てるようにしようと思っているのですが、DrawLineなどが邪魔をしているのかアプリケーションエラーでエミュレータが落ちてしまいます。