在手機螢屏最右側不停的畫一條豎線，推動前面已經畫好的豎線向左移動。
效果如同在手機螢屏最右側不停的出現一條條豎線，推著前面已經畫好的豎線 一點點左移，最終鋪滿手機螢屏。
怎么推動前面畫好的豎線一條條左移動呢？
uj5u.com熱心網友回復：
事先畫好這個圖，然后transaction影片從右到左移動就好了uj5u.com熱心網友回復：
不是。
這個是動態的，如同心電圖一樣。右邊不停的畫最新的線， 左邊的線依次推著左移。
uj5u.com熱心網友回復：
那可以用surfaceview來繪制，先定好線條屬性（長度，寬度），根據view的寬度定義陣列長度，定義個重繪時間如50ms， 每50ms重新繪制一次，每次將陣列里的資料繪制出來即可
uj5u.com熱心網友回復：
當有最新的豎線時，前面的螢屏上的豎線 怎么實作左移呢？將陣列里面的資料取出 每條線左移一個像素然后描畫所有的線？效率是不是太低了？
uj5u.com熱心網友回復：
好好利用資料結構啊，佇列。。
uj5u.com熱心網友回復：
整體效果是當來一條新豎線時 畫在螢屏最右側，同時前面所有已經畫好的豎線 挨個左移一像素。看著是螢屏最右側出現最新的豎線（豎線寬度是1像素），推著前面的豎線一點點左移。右邊不停的進線，螢屏左側不停的出。
現在是在定時器里走如下程式：pointX=螢屏寬度（假設=1080），這樣drawPoint始侄訓在螢屏最右側。畫完畫布左移一像素。當有新資料時，pointX= 1080，但是canvas已經左移了，導致再drawPoint時，所畫的點沒有畫在螢屏最右側。
不知這個pointX， translate 怎么結合實作最右側進，一點點左出的效果？
//畫最新的1 ping
for (int n = 0; n < mPingData.size(); n++) {
double[] point = mPingData.get(n);
SonarUtils.SonarCard card = SonarUtils.getColorIdByPointDb(point[0], point[2], point[1]);
mPaint.setColor(getResources().getColor(card.getColoValuerId()));
float pointY = ((float) getHeight() / (float) mPingData.size()) * (float) n;
mBufferCanvas.drawPoint(pointX, pointY, mPaint); //畫一像素的豎線點
}
mBufferCanvas.translate(-1, 0);
invalidate();
uj5u.com熱心網友回復：
為什么要左移呢？現在這樣不停重繪就已經有左移的效果了啊。
uj5u.com熱心網友回復：
重繪效率低，每條線有幾百個點組成的，快鋪滿螢屏時，1800（一條線占據一像素）*500這么些點，重繪一下耗時。。。。。
uj5u.com熱心網友回復：
上面我寫的代碼可以實作左移，但是最新的豎線不是在螢屏最右側了，translate后，pointX= 1080畫的點不在螢屏最右側，而是左移了（坐標1080左移了）。pointX++ 也不好使。
uj5u.com熱心網友回復：
如果是直線，為什么你不直接畫線條呢？為什么要畫點？uj5u.com熱心網友回復：
其實那是一些點。一豎條占據一像素，一豎條大約有幾百個點組成，每個點的顏色不一樣。為描述問題方便，我使用線來描述了。但是問題一樣。
uj5u.com熱心網友回復：
試了下，沒有你說的情況
uj5u.com熱心網友回復：
Scrolls可以達到效果吧uj5u.com熱心網友回復：
怎么實作的？？？求教。
uj5u.com熱心網友回復：
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Point;
import android.graphics.PorterDuff;
import android.util.AttributeSet;
import android.util.Log;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import android.view.ViewGroup;
import java.util.ArrayList;
import java.util.Iterator;
import java.util.LinkedList;
import java.util.Queue;
import java.util.Random;
/**
* @author : moj
* @date : 2019/8/2
* @description :
*/
public class LineView extends SurfaceView implements SurfaceHolder.Callback {
private SurfaceHolder mSurfaceHolder;
private int mWidth;
private int mHeight;
private int size;
private Paint mPaint;
private Queue<Integer> mQueue = new LinkedList<>();
private Random mRandom = new Random();
private int mLineWidth;
private int mGap;
private int marginL;
private int marginR;
public LineView(Context context) {
this(context, null);
}
public LineView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public LineView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mSurfaceHolder = getHolder();
mSurfaceHolder.addCallback(this);
mPaint = new Paint();
mPaint.setColor(Color.GREEN);
}
private void drawLine(){
if(mQueue.size() == size){
mQueue.poll();
}
int he =
mRandom.nextInt(ScreenUtil.px2dip(getContext(),mHeight)) / ScreenUtil.px2sp(getContext(), mLineWidth);
// Log.i("fff", he+"");
mQueue.add(he);
Canvas canvas = mSurfaceHolder.lockCanvas();
if(canvas == null){
return;
}
canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
Iterator<Integer> integerIterator = mQueue.iterator();
int count = Math.max(mQueue.size()-1,0);
while (integerIterator.hasNext()){
int h = integerIterator.next();
int x = mWidth - mLineWidth*(count+1) - count * mGap + mLineWidth/2;
for (int i = 0; i <h; i++) {
mPaint.setColor(randomColor());
canvas.drawPoint(x,
mHeight - i * mLineWidth,
mPaint);
}
count --;
}
mSurfaceHolder.unlockCanvasAndPost(canvas);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
mWidth = getMeasuredWidth();
mHeight = getMeasuredHeight();
// Log.i("fff",mWidth+","+ScreenUtil.getScreenWidth(getContext()) + ", "+getRight());
for (int i = ScreenUtil.dip2px(getContext(), 2);;i++){
if(mWidth % i == 0 && (mWidth / i) % 2 != 0){
mLineWidth = mGap = i;
size = mWidth / mGap;
mPaint.setStrokeWidth(mLineWidth);
break;
}
}
if(getLayoutParams() instanceof ViewGroup.MarginLayoutParams){
marginL = ((ViewGroup.MarginLayoutParams) getLayoutParams()).leftMargin;
marginR = ((ViewGroup.MarginLayoutParams) getLayoutParams()).rightMargin;
}
}
@Override
public void surfaceCreated(SurfaceHolder holder) {
new Thread(new Runnable() {
@Override
public void run() {
while (true){
// long i = System.currentTimeMillis();
drawLine();
// Log.i("fff", (System.currentTimeMillis() - i) +"");
try {
Thread.sleep(50);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
}).start();
}
@Override
public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
}
@Override
public void surfaceDestroyed(SurfaceHolder holder) {
}
public static int randomColor() {
Random random = new Random();
int r = random.nextInt(256);
int g = random.nextInt(256);
int b = random.nextInt(256);
return Color.argb(255,r,g,b);
}
}
這是我的代碼，可以參考一下
uj5u.com熱心網友回復：
收到了 謝謝謝謝。uj5u.com熱心網友回復：
當每個豎線有2000個點組成且每條豎線占據1像素的寬度， 當滿螢屏時， 你可以試一下描畫的效率。
uj5u.com熱心網友回復：
畫點肯定效率低，如果你的顏色漸變的畫，建議改用drawable來畫
uj5u.com熱心網友回復：
不是漸變。是顏色不同的各個點，顏色隨機 沒有規律。
不知怎么實作了........
uj5u.com熱心網友回復：
感徑訓得結合translate實作uj5u.com熱心網友回復：
現在是畫點太多的問題，你用translate還不是一樣要畫這么多點？
uj5u.com熱心網友回復：
translate可以實作畫布平移，省去了重新描畫已經畫好的點的時間。咱們現在的方法是定時描畫所有的點，2000*1000 點太多 效率低。
uj5u.com熱心網友回復：
好像無解？除非不用Invalidate() ?
不知道有什么辦法新加一條線的時候而不重繪以前的線條。
uj5u.com熱心網友回復：
可以在公司或者學習群里問高手。肯定有解答辦法。若有辦法 記得在此貼子里分享嗯，感謝。
uj5u.com熱心網友回復：
你可以試試把繪圖區域切割一下，固定的區域，用Image快取。轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/122100.html
標籤：Android