滚动大画布

Question

我需要一些帮助来理解滚动到Android中画布的项目的基本原理.假设我想创建一个时间轴,其中0的时间是可视化的顶部,随着时间的增加,时间轴继续呈现在前一点之下.如果我想在Android上渲染这个,我知道我可以通过覆盖onDraw()在画布上创建一堆项目.但是,假设可视化大于屏幕允许的可视化.

例如,在下面的第一张图片中,大黑框在我渲染时包含整个画布.我创建了一条垂直上下运行的蓝线以及几个黄色,绿色和蓝色矩形.红色框表示呈现可视化的Android屏幕.在最初打开时,所有项目都会被绘制,但只有红色框中包含的项目才会显示在屏幕上.

现在,如果用户要向下滚动,则最初出现在红色框下方的项目在视图中,而已经超出红色框的范围的项目不再可见,如第二张图片中所示.

我相信我需要使用滚动条,但我很遗憾该怎么做.我已阅读此页面http://developer.android.com/training/custom-views/custom-drawing.html, 解释如何创建自己的客户图像和此页面http://developer.android.com/training /custom-views/making-interactive.html解释如何使UI互动,但我想我错过了一些东西.

一个示例代码说明了这个问题(这是基本的,假设有逻辑指示框/行去的地方等)如下:

package com.example.scrolltest;

import com.example.scrolltest.Draw;

import android.os.Bundle;
import android.app.Activity;
import android.graphics.Color;

public class MainActivity extends Activity {
    Draw draw;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

    draw = new Draw(this);
    draw.setBackgroundColor(Color.WHITE);
    setContentView(draw);
    }
}

和

package com.example.scrolltest;


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


public class Draw extends View {
    Paint paint = new Paint();

    public Draw(Context context) {
        super(context);            
    }

    @Override
    public void onDraw(Canvas canvas) {

        paint.setColor(Color.GREEN);
        canvas.drawRect(30, 30, 90, 200, paint);
        paint.setColor(Color.BLUE);

        canvas.drawLine(100, 20, 100, 1900, paint);

        paint.setColor(Color.GREEN);
        canvas.drawRect(200, 2000, 400, 3000, paint);
        }
}

我无法弄清楚的是,我是如何使用滚动条向下滚动到屏幕外的矩形.我也不确定我是否正确启动或者应该使用drawables代替......

Answer 1

简单方法(如果所需高度不是很大).

使用ScrollView并在其中添加Draw视图.在onMeasure中计算该视图所需的高度.

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

draw = new Draw(this);
draw.setBackgroundColor(Color.WHITE);
ScrollView scrollView = new ScrollView(this);
scrollView.addView(draw);
setContentView(scrollView);
}

public class Draw extends View {
        Paint paint = new Paint();

        public Draw(Context context) {
            super(context);            
        }

        @Override
        protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
            // Compute the height required to render the view
            // Assume Width will always be MATCH_PARENT.
            int width = MeasureSpec.getSize(widthMeasureSpec);
            int height = 3000 + 50; // Since 3000 is bottom of last Rect to be drawn added and 50 for padding.
            setMeasuredDimension(width, height);
        }

        @Override
        public void onDraw(Canvas canvas) {

            paint.setColor(Color.GREEN);
            canvas.drawRect(30, 30, 90, 200, paint);
            paint.setColor(Color.BLUE);

            canvas.drawLine(100, 20, 100, 1900, paint);

            paint.setColor(Color.GREEN);
            canvas.drawRect(200, 2000, 400, 3000, paint);
            }
    }