# Remnants on movement and picture off-screening

**URL:** <https://discourse.processing.org/t/remnants-on-movement-and-picture-off-screening/10435>\
**Category:** Coding Questions\
**Created:** [April 18, 2019, 8:32pm UTC](https://discourse.processing.org/t/remnants-on-movement-and-picture-off-screening/10435 "2019-04-18T20:32:32Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![FlyingApple](https://avatars.discourse-cdn.com/v4/letter/f/f07891/32.png) [@FlyingApple](https://discourse.processing.org/u/FlyingApple)\
**Post date:** [April 18, 2019, 8:32pm UTC](https://discourse.processing.org/t/remnants-on-movement-and-picture-off-screening/10435/1 "2019-04-18T20:32:32Z")

</div>

This may be a stupid question but if you import a paint file with a character (rectangle) that moves on the screen is there any better way to clear the remnants left behind by the old copy of the character except just redrawing over it.

Also is there a way for you to have a 700x700 paint file and put it onto a 500x500 screen but the excess 200x200 go off the screen so the character (rectangle) can move and reveal more of the image?

---

<div class="post-metadata">

**Author:** ![josephh](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/josephh/32/210_2.png) [@josephh](https://discourse.processing.org/u/josephh)\
**Post date:** [April 18, 2019, 10:25pm UTC](https://discourse.processing.org/t/remnants-on-movement-and-picture-off-screening/10435/2 "2019-04-18T22:25:51Z")

</div>

Hi,

Here I think you are talking about drawing a background at each frame so it’s clearing the previous “character” drawn on the screen? By the way what do you call a paint file? Is it an image?

Can you be more explicit on the last question? If it’s what I am thinking, if you import an image that is wider than the actual size of your canvas, the excess is not going to disepear so that’s fine.

---

<div class="post-metadata">

**Author:** ![Stanlepunk](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/stanlepunk/32/11509_2.png) [@Stanlepunk](https://discourse.processing.org/u/Stanlepunk)\
**Post date:** [April 19, 2019, 9:34am UTC](https://discourse.processing.org/t/remnants-on-movement-and-picture-off-screening/10435/3 "2019-04-19T09:34:53Z")

</div>

> [@josephh](#):
>
> Can you be more explicit on the last question?

In this way @FlyingApple can you pass your code make understanble your problem.

---

<div class="post-metadata">

**Author:** ![FlyingApple](https://avatars.discourse-cdn.com/v4/letter/f/f07891/32.png) [@FlyingApple](https://discourse.processing.org/u/FlyingApple)\
**Post date:** [April 19, 2019, 7:19pm UTC](https://discourse.processing.org/t/remnants-on-movement-and-picture-off-screening/10435/4 "2019-04-19T19:19:38Z")

</div>

So there is an external image file (paint file if it matters) which is 500x500.

```auto
void setup()
{
  size(700, 700);
  image = requestImage("levelDetail.png");
}

void draw()
{

  image(image, 0, 0, width, height);
}

```

The same thing appears but larger if i do size(700,700).

I want the size of the image to stay 500x500 but the remaining pixel space is left blank.

Sorry idk how to format code.`Preformatted text`

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [April 20, 2019, 1:07am UTC](https://discourse.processing.org/t/remnants-on-movement-and-picture-off-screening/10435/5 "2019-04-20T01:07:55Z")

</div>

> [@FlyingApple](#):
>
> image(image, 0, 0, width, height);

try:

```auto
image(image,0,0);

```

but you see, image is a function, so i not like you name your picture “image” how about “img”

* * *

in the forum editor is a headerline with some symbols,  
to post code pls. use

```auto
</> code tag

```

and PASTE you ( in IDE formatted [ctrl][t] ) code into

---

<div class="post-metadata">

**Author:** ![FlyingApple](https://avatars.discourse-cdn.com/v4/letter/f/f07891/32.png) [@FlyingApple](https://discourse.processing.org/u/FlyingApple)\
**Post date:** [April 20, 2019, 8:46am UTC](https://discourse.processing.org/t/remnants-on-movement-and-picture-off-screening/10435/6 "2019-04-20T08:46:37Z")

</div>

Thanks for the answer to the question and thanks to how to do the format

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [April 21, 2019, 4:40pm UTC](https://discourse.processing.org/t/remnants-on-movement-and-picture-off-screening/10435/7 "2019-04-21T16:40:26Z")

</div>

Call it a png file – MSPaint can save different kinds of files, and different versions of paint have different default file formats, so that is ambiguous, like “house pet” (so dog? cat?).

> [@FlyingApple](#):
>
> is there any better way to clear the remnants left behind by the old copy of the character except just redrawing over it.

Clearing with background and redrawing is usually the best way.

> [@FlyingApple](#):
>
> but the excess 200x200 go off the screen so the character (rectangle) can move and reveal more of the image?

Yes. Use `translate()`. See recent discussions:

- [Make the camera follow an object - #6 by jeremydouglass](https://discourse.processing.org/t/help-with-camera-function/10386/6)

- [[Processing 3] Moving through a map bigger than the screen - #4 by jeremydouglass](https://discourse.processing.org/t/processing-3-moving-through-a-map-bigger-than-the-screen/10393/4)

One important thing – don’t draw your character and background onto one image! Draw your character on one image, draw your background on another, import them both.