Develop Reference

how to set background by dynamic coding

i used to paint the background but i want to make it drawable /picture background and the wrong in drawbackground what shall i do ?
public void surfaceCreated(SurfaceHolder arg0) {
Bitmap background = BitmapFactory.decodeResource(context.getResources(), R.drawable.download);
float scale = (float)background.getHeight()/(float)GetHeight();
int newWidth = Math.round(background.getWidth()/scale);
int newHeight = Math.round(background.getHeight()/scale);
scaled = Bitmap.createScaledBitmap(background, newWidth, newHeight, true);
}
public void onDraw(Canvas canvas) {
canvas.drawPicture(mbgdDrawable);// draw the background
}
public void DrawBackground(Canvas canvas) {
canvas.drawBitmap(scaled, mScreenHeight, mScreenWidth,null);
}

Sprite Sheet - new sprite being drawn on top of old sprites

Basically I tried to use a sprite sheet for animation. The aim is to count from 1 to 8 with 1 second interval. The numbers are image on a sprite sheet. The problem is once the number is being drawn to the canvas, it just won't go away. New image just drawn on top of the unwanted old image. Like this:
Is there a way to clear what has been drawn, so that new image can be drawn on a clean canvas?
DrawStripFrame Class:
public class DrawStripFrame extends SurfaceView implements Runnable{
/**variables declared here*/
public DrawStripFrame (Context context){
super (context);
this.context = context;
holder = getHolder();
}
public void setDrawStripFrame(Bitmap bitmap, int width, int height, int columns){
this.bitmap = bitmap;
this.width = width;
this.height = height;
this.columns = columns;
}
}
#Override
public void run(){
while(running){
if(!holder.getSurface().isValid())
continue;
Canvas canvas = holder.lockCanvas();
draw(canvas);
holder.unlockCanvasAndPost(canvas);
}
}
public void draw (Canvas canvas){
update();
/**4 being no. of columns and 2 being no. of row*/
int u = (frame % 4)*(width/4);
int v = (frame / 4)*(height/2);
Rect src = new Rect(u,v,u+(width/4),v+(height/2));
Rect dst = new Rect (0,0, 100,100);
Paint paint = new Paint();
canvas.drawBitmap(bitmap, src, dst, paint);
}
public void resume() {
running = true;
gameloop = new Thread(this);
gameloop.start();
}
public void update (){
frame++;
if (frame>10)
frame = 0;
try {
Thread.sleep(1000);
} catch (InterruptedException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}

In your case you could just redraw the canvas with a color like this:
public void draw (Canvas canvas){
update();
// clearing canvas
canvas.drawColor(Color.BLUE); // whatever color you need it to be
/**4 being no. of columns and 2 being no. of row*/
int u = (frame % 4)*(width/4);
int v = (frame / 4)*(height/2);
Rect src = new Rect(u,v,u+(width/4),v+(height/2));
Rect dst = new Rect (0,0, 100,100);
Paint paint = new Paint();
canvas.drawBitmap(bitmap, src, dst, paint);
}

Updating a Layout class

My problem is, that I have a Layout class called by an Inflater and I want to run a method from this class to update a picture every few seconds.
I wanted to do this with handlers and the run() method, but my problem is, the picture only updates itself when I am interacting with the screen (clicking my only button).
Do you know what I did wrong?
Here is my GameLayout class:
package de.undeadleech.frogjump;
public class GameLayout extends View implements Runnable
{
private Sprite sprite;
private Bitmap bmp;
private Handler handler = new Handler();
public GameLayout(Context context)
{
super(context);
bmp = BitmapFactory.decodeResource(getResources(), R.drawable.froschanimation);
sprite = new Sprite(bmp, 0, 0, 400, 100, 5, 4);
handler.postDelayed(this, 0);
}
#Override
protected void onDraw(Canvas canvas)
{
sprite.draw(canvas);
}
public void update(long currentTimeMillis)
{
sprite.update(currentTimeMillis);
}
#Override
public void run()
{
sprite.update(System.currentTimeMillis());
handler.postDelayed(this, 0);
}
}
EDIT:
Here is my Sprite class because you wanted to see it:
package de.undeadleech.frogjump;
public class Sprite
{
//private static final String TAG = Sprite.class.getSimpleName();
private Bitmap bitmap; // the animation sequence
private Rect sourceRect; // the rectangle to be drawn from the animation bitmap
private int frameNr; // number of frames in animation
private int currentFrame; // the current frame
private long frameTicker; // the time of the last frame update
private int framePeriod; // milliseconds between each frame (1000/fps)
private int spriteWidth; // the width of the sprite to calculate the cut out rectangle
private int spriteHeight; // the height of the sprite
private int x; // the X coordinate of the object (top left of the image)
private int y; // the Y coordinate of the object (top left of the image)
public Sprite(Bitmap bitmap, int x, int y, int width, int height, int fps, int frameCount)
{
this.bitmap = bitmap;
this.x = x;
this.y = y;
currentFrame = 0;
frameNr = frameCount;
spriteWidth = bitmap.getWidth() / frameCount;
spriteHeight = bitmap.getHeight();
sourceRect = new Rect( 0, 0, spriteWidth, spriteHeight);
framePeriod = 1000 / fps;
frameTicker = 0l;
}
public void update(long gameTime)
{
if (gameTime > frameTicker + framePeriod)
{
frameTicker = gameTime;
// increment the frame
currentFrame++;
if (currentFrame >= frameNr)
{
currentFrame = 0;
}
}
// define the rectangle to cut out sprite
this.sourceRect.left = currentFrame * spriteWidth;
this.sourceRect.right = this.sourceRect.left + spriteWidth;
}
public void draw(Canvas canvas)
{
// where to draw the sprite
Rect destRect = new Rect( x, y, x + spriteWidth, y + spriteHeight);
canvas.drawBitmap(bitmap, sourceRect, destRect, null);
}
}

Instead of posting Runnable you should call invalidate() when you need to redraw your layout. Also you should update state of your Sprite in onDraw method as well.

Setting image background in SurfaceView, getting black screen

Okay so Im trying to set the background of a SurfaceView to a JPG file. But it doesn't seem to want to draw the image, and all I get is a black screen.
Here:s my code:
public class FloorplanActivity extends Activity{
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
MapView mapView = new MapView(getApplicationContext());
setContentView(mapView);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.floorplan, menu);
return true;
}
class MapView extends SurfaceView{
Rect testRectangle1 = new Rect(0, 0, 50, 50);
Bitmap scaled;
int x;
int y;
public MapView(Context context) {
super(context);
}
public void surfaceCreated(SurfaceHolder arg0){
Bitmap background = BitmapFactory.decodeResource(getResources(), R.drawable.floorplan);
float scale = (float)background.getHeight()/(float)getHeight();
int newWidth = Math.round(background.getWidth()/scale);
int newHeight = Math.round(background.getHeight()/scale);
scaled = Bitmap.createScaledBitmap(background, newWidth, newHeight, true);
}
public void onDraw(Canvas canvas) {
canvas.drawBitmap(scaled, 0, 0, null); // draw the background
}
Not sure why it won't draw the "floorplan" image I have saved in the drawable-mdpi folder.
Anyone got any suggestions?
Thanks.
EDIT: After doing some debugging with breakpoints, it seems like the "scaled" variable becomes "Infinity" for some reason and as such the newWidth and newHeight variables become less than 0 and the application crashes.
This is only if I move the entire surfaceCreated into the contstructor, if I leave the code as is here then it doesn't do anything beyind displaying a black screen.
No idea what's causing it to do that though...

First, you should implement SurfaceHolder.Callback interface with your MapView class and set it as a callback for its SurfaceHolder to make the app call your onSurfaceCreated() metod.
Second, if you want your onDraw() method to be called, then call setWillNotDraw(false) in your MapView's constructor.
I've done that as following:
public class MapView extends SurfaceView implements SurfaceHolder.Callback {
private Bitmap scaled;
public MapView(Context context, AttributeSet attrs) {
super(context, attrs);
setWillNotDraw(false);
getHolder().addCallback(this);
}
public void onDraw(Canvas canvas) {
canvas.drawBitmap(scaled, 0, 0, null); // draw the background
}
#Override
public void surfaceCreated(SurfaceHolder arg0) {
Bitmap background = BitmapFactory.decodeResource(getResources(), R.drawable.dr);
float scale = (float) background.getHeight() / (float) getHeight();
int newWidth = Math.round(background.getWidth() / scale);
int newHeight = Math.round(background.getHeight() / scale);
scaled = Bitmap.createScaledBitmap(background, newWidth, newHeight, true);
}
#Override
public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
// TODO Callback method contents
}
#Override
public void surfaceDestroyed(SurfaceHolder holder) {
// TODO Callback method contents
}
}
And it works well.
NOTE: Moved MapView class to a separate *.java file.
Update Watch Duplicate Copy Move

canvas zoom in partially

I want to zoom in the canvas board partially as the letter tray button will be fixed and the board will be zoom,
The partially coding is as mention below and the screen is fully draw in canvas which can be viewed as mention at the bottom.. please help and thanks for you concern.
public class BoardView extends SurfaceView implements SurfaceHolder.Callback
{
class DrawingThread extends Thread implements OnTouchListener {
public DrawingThread(SurfaceHolder holder, Handler handler) {
mSurfaceHolder = holder;
public void setRunning(boolean b) {
mRun = b;
}
#Override
public void run() {
while (mRun) {
Canvas c = null;
try {
c = mSurfaceHolder.lockCanvas(null);
synchronized (mSurfaceHolder) {
// System.gc();
// c.scale(canvasScaleX, canvasScaleY);
// c.save();
// c.translate(canvasTranslateX, canvasTranslateY);
doDraw(c);
}
updateGame();
} finally {
if (c != null) {
mSurfaceHolder.unlockCanvasAndPost(c);
}
}
}
private void doDraw(Canvas canvas) {
if (ge == null)
return;
Rect bRect = new Rect(0, 0, dims.getTotalWidth(),
dims.getScoreHeight() + dims.getBoardheight());
Drawable drawable = getResources().getDrawable(R.drawable.board);
drawable.setBounds(bRect);
drawable.draw(canvas);
Rect tRect = new Rect(0, dims.getScoreHeight()
+ dims.getBoardheight(), dims.getTotalWidth(),
dims.getTotalHeight());
canvas.drawRect(tRect, fillTrayPaint);
int topHeight = dims.getScoreHeight() + dims.getBoardheight();
int bottom = (dims.getTotalHeight() + 5)
- (dims.getTotalWidth() / Tray.TRAY_SIZE);
Rect rect = new Rect(0, topHeight, dims.getTotalWidth(), bottom - 7);
Drawable drawableTray = getResources()
.getDrawable(R.drawable.strip);
drawableTray.setBounds(rect);
drawableTray.draw(canvas);
drawTray(canvas);
drawBoard(canvas);
// drawScore(canvas);
drawMovingTile(canvas);
}
public BoardView(Context context, AttributeSet attrs) {
super(context, attrs);
SurfaceHolder holder = getHolder();
holder.addCallback(this);
// endTurn=(ImageButton)findViewById(R.id.endturn_button_horizontal);
thread = new DrawingThread(holder, handler);
}
#Override
public void surfaceChanged(SurfaceHolder holder, int format, int width,
int height) {
}
#Override
public void surfaceCreated(SurfaceHolder holder) {
final float scale1 = getResources().getDisplayMetrics().density;
defaultFontSize = (int) (MIN_FONT_DIPS * scale1 + 0.5f);
thread.setDefaultFontSize(defaultFontSize);
dimensions = calculateDimensions(getWidth(), getHeight());
thread.setDimensions(dimensions);
thread.setRunning(true);
// if (thread != null && !thread.isAlive())
thread.start();
}
#Override
public void surfaceDestroyed(SurfaceHolder holder) {
boolean retry = true;
thread.setRunning(false);
while (retry) {
try {
thread.join();
retry = false;
} catch (InterruptedException e) {
}
}
}

We can simply do it by canvas.clipRect(rectangle), at this point what we are suppose to do is save the canvas canvas.save() and after canvas.clipRect(rectangle) call canvas.restore().

Consider trying something like this:
Create a bitmap from the canvas you wish to zoom into.
When rendering that bitmap to the screen, you can change the scr rect
(which will "zoom" into the bitmap).
I hope this helps.

I think you need to render your game board into offscreen bitmap and then draw this bitmap at canvas using Matrix, so you will be able to change its position and scale.

I believe the easiest way to do this would be to use Canvas#scale(float scale, int pivotx, int pivoty) method. It essentially grows the entire canvas uniformally which really is what zooming is from a 2D perspective.
canvas.scale(2.0f, getWidth()/2, getHeight()/2) will scale the image by 2 from the center. canvas.scale(1.0f, getWidth()/2, getHeight()/2) will shrink it back.
I have never tried this in this context, so if you decide to try it report back the results please! I'd like to know for future reference.