无法通过Android中的textview单元格正确地在gridview元素上绘制线条

时间:2014-04-23 06:56:01

标签: android gridview canvas draw

我想实现Word Search应用。作为实现的一部分,我遇到了网格视图单元格(形成单词的字母)上的画布和绘制线,以指示用户正在用手指触摸字母以形成单词。

我已经部分成功到现在为止我可以在网格视图的字母上画一条线,但该线不是通过网格视图的中心。

任何人都可以帮助我提出宝贵的建议。

快速浏览下面的屏幕截图以获得清晰的想法。


已编辑:我正在发布代码以了解我是如何实现它的。

的xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/root"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#fff" >

<RelativeLayout
    android:id="@+id/topbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:background="#A9E2F3" >

    <LinearLayout
        android:id="@+id/topbar"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#336699"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/btn_pause"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Pause" />

        <Chronometer
            android:id="@+id/chronometer1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Chronometer" />

        <TextView
            android:id="@+id/counter"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:textSize="20sp"
            android:typeface="serif" />
    </LinearLayout>
</RelativeLayout>



<FrameLayout
    android:id="@+id/gridFrame"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/wTable"
    android:layout_below="@+id/textdisplay" >

    <GridView
        android:id="@+id/grid"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#E7E8E9"
        android:fitsSystemWindows="true"
        android:gravity="center"
        android:horizontalSpacing="10sp"
        android:numColumns="10"
        android:padding="1dp"
        android:stretchMode="columnWidth"
        android:verticalSpacing="10sp" >
    </GridView>
</FrameLayout>

<GridView
    android:id="@+id/wTable"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:background="#fff"
    android:numColumns="3"
    android:orientation="vertical" />


  </RelativeLayout>

绘画正在绘制包含网格视图的框架布局。网格视图元素通过自定义文本视图文件打印。

要画一条线,我使用了LineView.java

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.Log;
import android.view.View;

public class LineView extends View {

public static final float LINE_WIDTH = 30.0f;
public Paint paint = new Paint();
protected Context context;

public float startingX, startingY, endingX, endingY;

public LineView(Context context) {
    super(context);
    this.context = context;
    paint.setColor(Color.parseColor("#2E9AFE"));
    paint.setStrokeWidth(LINE_WIDTH);
    paint.setStrokeJoin(Paint.Join.ROUND);
    paint.setStrokeCap(Paint.Cap.ROUND);
    paint.setDither(true);
    paint.setAntiAlias(true);
    paint.setStyle(Paint.Style.FILL);
    paint.setAlpha(90);

}

public void setPoints(float startX, float startY, float endX, float endY) {

    startingX = startX;
    startingY = startY;
    endingX = endX;
    endingY = endY;
    invalidate();
}

@Override
public void onDraw(Canvas canvas) {
    Log.e("LINEVIEW", "startingX" + startingX + "  startingY:" + startingY);
    Log.e("LINEVIEW", "endingX" + endingX + "  endingY:" + endingY);
    // canvas.drawLine(startingX, startingY, endingX, endingY, paint);
    canvas.drawLine(startingX, startingY, endingX, endingY, paint);

}
}


Main Activity where logic is implemented: 
Written only the required logic here.

 newGrid = (GridView) findViewById(R.id.grid);

    newGrid.setAdapter(new FormTheGridLetters());

    newGrid.setOnTouchListener(new OnTouchListener() {

        @Override
        public boolean onTouch(View v, MotionEvent event) {
            // if (mp.isPlaying()) {
            // mp.stop();
            // }

            int action = event.getActionMasked();
            switch (action) {
                case MotionEvent.ACTION_DOWN:
                case MotionEvent.ACTION_MOVE:
                case MotionEvent.ACTION_UP:
                    // data
                    PaintViewHolder newPaint = new PaintViewHolder();
                    newPaint.DrawLine = new LineView(WordSearchActivity.this);
                    gridFrame.addView(newPaint.DrawLine);
                    buildWord = new StringBuilder();
                    int x = (int) event.getX();
                    int y = (int) event.getY();
                    // test = new LineView(WordSearchActivity.this);
                    int position = newGrid.pointToPosition(x, y);
                    Point one,
                    two;

                    if (position != GridView.INVALID_POSITION) {

                        v.getParent().requestDisallowInterceptTouchEvent(true);
                        cellView = (TextView) newGrid.getChildAt(position);

                        String a = cellView.getText().toString();
                        // Log.v(">>>>><<<<<<<????????", a.toString());
                        switch (action) {
                            case MotionEvent.ACTION_DOWN:
                                startX = event.getX();
                                startY = event.getY();


                                break;
                            case MotionEvent.ACTION_MOVE:


                                break;
                            case MotionEvent.ACTION_UP:
                              // Checking the list for formed word ;
                                                       //if found that is painted
                                for (int i1 = 0; i1 < Ans.size(); i1++)
                                {
                                    if (formedWord.equals(Ans.get(i1)))
                                    {


                     answerAdapter.notifyDataSetChanged();
                     newPaint.DrawLine.setPoints(startX, startY, x, y);
               // Painted the letters by passing starting and ending points 


                                    }

                                }


                                break;
                        }
                    } else {
                        if (mSelecting) {
                            mSelecting = false;
                        }
                    }
                    break;
                case MotionEvent.ACTION_CANCEL:
                    mSelecting = false;
                    break;
            }
            return true;
        }
    });

1 个答案:

答案 0 :(得分:3)

我不知道你是否解决了这个问题,但无论如何我会回答可能有这些问题的人。收到有效位置后,您可以获得视图的中心,并可以将这些值设置为绘制的开始。

像这样:

    if (position != GridView.INVALID_POSITION) {

        MyList.add(position);
        v.getParent().requestDisallowInterceptTouchEvent(true);
        TextView cellView = (TextView) gridView.getChildAt(position);
         centreX = cellView.getX() + cellView.getWidth()  / 2;
         centreY = cellView.getY() + cellView.getHeight() / 2;


    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:

            newPaint.DrawLine.touch_start(x, y,centreX,centreY);

我已经尝试过这段代码而且它正在运行。我不认为你需要了,但我最近加入了这个网站,所以也许它会帮助其他人。如果你愿意,我可以发布更多代码

newPaint.DrawLine.touch_start(x, y,centreX,centreY);

就是这个问题的诀窍。 希望这会有所帮助。