# Toggle Text on controlP5

**URL:** <https://discourse.processing.org/t/toggle-text-on-controlp5/8014>\
**Category:** Libraries\
**Created:** [February 1, 2019, 4:34am UTC](https://discourse.processing.org/t/toggle-text-on-controlp5/8014 "2019-02-01T04:34:20Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Coolconor98](https://avatars.discourse-cdn.com/v4/letter/c/3be4f8/32.png) [@Coolconor98](https://discourse.processing.org/u/Coolconor98)\
**Post date:** [February 1, 2019, 4:34am UTC](https://discourse.processing.org/t/toggle-text-on-controlp5/8014/1 "2019-02-01T04:34:20Z")

</div>

So I’m using a library called controlP5 for a project I’m doing. I’m making a menu where I use conrtolP5’s buttons and toggles. The buttons work fine but I’m having a problem with the toggles. The buttons have the name of the button labelled ontop of the button itself while the toggle places the label below the toggle. I was wondering how I could move the label to the middle of the toggle similarly to how the button is? Here is the code I’m using for the toggle:

```auto
boolean items = true;
Width = 1280;
Height = 720;

cp5.addToggle("Items")
.setBroadcast(false)
.setValue(items)
.setBroadcast(true)
.setPosition(Width/10,Height <em>6/10)
.setSize(Width</em> 8/10,Height/10)
.setColorBackground(color(255,0,0))
.setColorActive(color(110,160,255))
.getCaptionLabel()
.setFont(font)
.toUpperCase(false)
;

```

---

<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:** [February 1, 2019, 4:27pm UTC](https://discourse.processing.org/t/toggle-text-on-controlp5/8014/2 "2019-02-01T16:27:59Z")

</div>

i do have limited effects with using

```auto
.setCaptionLabel("\n my Items Label")
.align(0,0,0,1)
.setColorLabel(color(0,200,0)) 

```

but why you not use your button  
and change the logic to ON OFF with color change background and text change START / STOP…

---

<div class="post-metadata">

**Author:** ![Coolconor98](https://avatars.discourse-cdn.com/v4/letter/c/3be4f8/32.png) [@Coolconor98](https://discourse.processing.org/u/Coolconor98)\
**Post date:** [February 1, 2019, 5:51pm UTC](https://discourse.processing.org/t/toggle-text-on-controlp5/8014/3 "2019-02-01T17:51:04Z")

</div>

I was looking for the toggle to change colour when activated and deactivated so that why I used one instead of a toggle. I wasn’t able to use your code exactly but showing me the .align command really helped as I figured out how to fix it. So for anyone else with a similar issue all you need to do is add “.align(ControlP5.CENTER,ControlP5.CENTER)” on the line after “.toUpperCase(false)”. Thank you for your help kll.