# Adding a Start Screen to my drawing program

**URL:** <https://discourse.processing.org/t/adding-a-start-screen-to-my-drawing-program/27290>\
**Category:** Coding Questions\
**Created:** [January 22, 2021, 6:44am UTC](https://discourse.processing.org/t/adding-a-start-screen-to-my-drawing-program/27290 "2021-01-22T06:44:26Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Prxt.3k](https://avatars.discourse-cdn.com/v4/letter/p/9e8a1a/32.png) [@Prxt.3k](https://discourse.processing.org/u/Prxt.3k)\
**Post date:** [January 22, 2021, 6:44am UTC](https://discourse.processing.org/t/adding-a-start-screen-to-my-drawing-program/27290/1 "2021-01-22T06:44:26Z")

</div>

Can someone let me know how it’s possible to add this to my code, for example, I want to add a start game button in this code and this screen should pop up every time I start a canvas and to enter the program I would need to press a Start gameplay button. Thanks for any possible help.

```auto
int startTimeMs;
// The time until the game starts, in milliseconds
// (easy to convert to seconds, sec = ms/1000)
final int startDelayMs = 5000;
boolean atStartup = true;
 
int gameWidth = 600;
int gameHeight = 300;
 
void setup(){
  size(600, 300);
  // Current time, in milliseconds
  startTimeMs = millis();
}
 
void draw(){
  // If we're in the startup time window, show a countdown
  if (atStartup) {
    // The current time, in milliseconds
    int curTimeMs = millis();
    // The remaining time in the startup period
    int startupTimeRemainingMs = startDelayMs - (curTimeMs - startTimeMs);
    startScreen(startupTimeRemainingMs);
    atStartup = startupTimeRemainingMs > 0;
    // Short-circuit if we're still in the startup phase.
    return;
  }
  background(240);
  fill(0);
  textAlign(CENTER,CENTER);
  text("Welcome to DrawSpace!", gameWidth/2, gameHeight/2);
}
 
void startScreen(int remainingTimeMs){
  background(50);
  textSize(50);
  fill(0);
  textAlign(CENTER,CENTER);
  // Show the remaining time, in seconds;
  // show n when there are n or fewer seconds remaining. 
  text(ceil(remainingTimeMs/1000.0), gameWidth/2, gameHeight/2);
}

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [January 22, 2021, 6:57am UTC](https://discourse.processing.org/t/adding-a-start-screen-to-my-drawing-program/27290/2 "2021-01-22T06:57:02Z")

</div>

Yes it’s possible

Chrisir

---

<div class="post-metadata">

**Author:** ![Prxt.3k](https://avatars.discourse-cdn.com/v4/letter/p/9e8a1a/32.png) [@Prxt.3k](https://discourse.processing.org/u/Prxt.3k)\
**Post date:** [January 22, 2021, 7:57am UTC](https://discourse.processing.org/t/adding-a-start-screen-to-my-drawing-program/27290/3 "2021-01-22T07:57:37Z")

</div>

How would I be able to do that?

Thanks,

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [January 22, 2021, 8:08am UTC](https://discourse.processing.org/t/adding-a-start-screen-to-my-drawing-program/27290/4 "2021-01-22T08:08:08Z")

</div>

copy the parts you need from above into your Sketch

> [@Prxt.3k](#):
>
> `boolean atStartup = true;`

you need this and the sections where `atStartup ` occurs

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [January 22, 2021, 9:40am UTC](https://discourse.processing.org/t/adding-a-start-screen-to-my-drawing-program/27290/5 "2021-01-22T09:40:31Z")

</div>

> [@Prxt.3k](#):
>
> this screen should pop up every time I start a canvas

set `atStartup = true; ` when you want to go to the start screen

say `atStartup = false; ` to leave the start screen and enter the Drawing Part of your Sketch

> [@Prxt.3k](#):
>
> to enter the program I would need to press a Start gameplay button

you know how to make buttons. Make a Start gameplay button; then display it in the `atStartup == true ` section in draw(). When the button is pressed, say `atStartup = false; `

**mousePressed**

Therefore in mousePressed() say similar to the code in draw() :

```auto
void mousePressed() {
    if(atStartup) {
        //if mouse inside button, but not necessary
        atStartup=false; 
        return; // leave 
    }// if

    // WHAT you have in mousePressed() now

}//func 

```

Chrisir

---

<div class="post-metadata">

**Author:** ![Prxt.3k](https://avatars.discourse-cdn.com/v4/letter/p/9e8a1a/32.png) [@Prxt.3k](https://discourse.processing.org/u/Prxt.3k)\
**Post date:** [January 23, 2021, 5:18am UTC](https://discourse.processing.org/t/adding-a-start-screen-to-my-drawing-program/27290/6 "2021-01-23T05:18:14Z")

</div>

Alright, Thank You So Much!!!