读书人

让Surface中作图的内容响应用户的交互

发布时间: 2013-10-31 12:03:52 作者: rapoo

让Surface中绘制的内容响应用户的交互(状态变化)

被绘制的内容响应用户的交互,简单的看就是绘制内容的状态在用户操作时发生了变化。

对于在SurfaceView中绘制的内容,如果我们希望文字可以水平移动,看看我们可以做些什么来实现这样的效果?首先,为了让例子简单,我们从XML文件中的Button接收用户的操作。然后在Activity中让自定义的View做我们所希望的状态变化,前提是获得自定义View的引用和为其添加操作接口。最后,在MyView中改变文字的X坐标来实现文字位置的改变,需要刷新(动态或静态),本例选择动态刷新。

1、布局文件

?

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical">    <Button        android:id="@+id/button_left"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="左" />    <Button        android:id="@+id/button_right"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="右" />    <com.test.MyView        android:id="@+id/my_view"        android:layout_width="wrap_content"        android:layout_height="wrap_content" /></LinearLayout

说明:

?

    为了简化,我们从XML文件中放置按钮,接收用户的操作事件。给MyView指定ID,为了后面可以获得其引用。

2、在Activity中添加用户点击按钮操作

?

public class MainActivity extends Activity implements OnClickListener {private Button btnLeft;private Button btnRight;private MyView myView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.activity_main);myView = (MyView) findViewById(R.id.my_view);btnLeft = (Button) findViewById(R.id.button_left);btnRight = (Button) findViewById(R.id.button_right);btnLeft.setOnClickListener(this);btnRight.setOnClickListener(this);}@Overridepublic void onClick(View v) {switch (v.getId()) {case R.id.button_left:myView.left();break;case R.id.button_right:myView.right();break;default:break;}}}

?说明:

?

    左移文字:myView.left();右移文字:myView.right();

3、给MyView添加行为和属性

public class MyView extends SurfaceView implements Callback, Runnable {private Paint mPaint;private SurfaceHolder mSurfaceHolder;private Thread mThread;private float x = 10;private void initial() {mPaint = new Paint();  mPaint.setAntiAlias(true);        this.setKeepScreenOn(true);        mPaint.setColor(Color.RED);                  mThread = new Thread(this);                mSurfaceHolder = getHolder();        mSurfaceHolder.addCallback(this);        }public MyView(Context context) {super(context);initial();}public MyView(Context context, AttributeSet attrs) {super(context, attrs);initial();}public void left() {x = x - 5;}public void right() {x = x + 5;}private void draw() {Canvas mCanvas = null;try {mCanvas = mSurfaceHolder.lockCanvas();if (mCanvas != null) {mCanvas.drawColor(Color.WHITE);mCanvas.drawText("绘制文字", x, 20, mPaint);mCanvas.drawCircle(35, 50, 20, mPaint);}} catch (Exception e) {e.printStackTrace();} finally {if (mCanvas != null) {mSurfaceHolder.unlockCanvasAndPost(mCanvas);}}}@Overridepublic void surfaceChanged(SurfaceHolder holder, int format, int width,int height) {}@Overridepublic void surfaceCreated(SurfaceHolder holder) {mThread.start();}@Overridepublic void surfaceDestroyed(SurfaceHolder holder) {System.out.println("www:surfaceDestroyed");}@Overridepublic void run() {while (true) {draw();try {Thread.sleep(100);} catch (InterruptedException e) {e.printStackTrace();}}}}

?说明:

    添加文字x坐标位置的属性:private float x = 10;添加行为,左移:left(); 右移:right();在run方法里面修改逻辑为每隔0.1秒刷新绘制一次;

效果如下:
让Surface中作图的内容响应用户的交互(状态变化)

?

希望对你有所帮助!:)

?

?

?

读书人网 >移动开发

热点推荐