Skip to first unread message

Jose Juan Gutierrez

unread,
Mar 1, 2016, 7:05:02 PM3/1/16
to MIT App Inventor Forum
I´m trying to create an app with several buttons that when clicked are replaced with an image. I want them to reapear after they have been used.

The buttons are images of paint colors. When one is clicked, it is replaced by the image of a brush. I want that button to reapear, when another button is cliked. There are 10 different color buttons in my app.
pic.png

Abraham Getzler

unread,
Mar 1, 2016, 9:02:05 PM3/1/16
to MIT App Inventor Forum
That sounds like a radio button group.

Make a common procedure called ShowAllButtons, that
makes all ten buttons visible.(or disabled, per taste).

For each of the ten buttons, in its Click event, call ShowAllButtons
and then set that button invisible (or disabled, per taste).

There are more advanced ways to do this, but this should work too.

ABG

Scott Ferguson

unread,
Mar 1, 2016, 11:04:16 PM3/1/16
to MIT App Inventor Forum
Abraham is correct.
This requires the logic of a radio button group.
Here is one way to do it.
---
blks.PNG
Paintbrush.aia
brush (1).png

Jose Juan Gutierrez

unread,
Mar 2, 2016, 1:53:06 PM3/2/16
to mitappinv...@googlegroups.com

Thanks for giving me feedback, Abraham and Scott. The code worked perfectly well on my app. This is the code and a snapshot of my app. Is it possible to include a button that can be clicked on and augment and diminish the width of the paint line, similar to a slider.

The thing is that there is not sufficient space for a slider on my app. I wanted to make the little pincel in between the two bottons disappea, as well, but instead, I want to include a button to increment or decrease the width of the paint line.


Abraham Getzler

unread,
Mar 2, 2016, 2:53:54 PM3/2/16
to MIT App Inventor Forum
Add an Arrangement ("Toolbar"?) to your screen (vertical or Horizontal), initially invisible,
and put the slider in it.  Wire the slider to do what you want.  
Add a button to toggle the toolbar visible/invisible.

Have the other screen elements' arrangements expand to fill when the toolbar is invisible.

ABG

Scott Ferguson

unread,
Mar 2, 2016, 8:41:11 PM3/2/16
to MIT App Inventor Forum
..and another way that might work is to use one button with different background images that show a different line thickness each time the button is pressed.

| = 1.png
| = 2.png
| = 3.png
| = 4.png

In the button click block, test what the current image is then when the button is pressed, set the picture to the next larger image.
When 4.png is the current image and the button is pressed, select 1.png
---

Jose Juan Gutierrez

unread,
Mar 3, 2016, 4:27:19 PM3/3/16
to MIT App Inventor Forum

There seems to be a problem with my app. I´ve added ten buttons to the canvas. In the emulator, the buttons and colors are exactly arranged in the same way that they are in the designer view, but on a real phone, at he start, they are arranged the same, but when I click on some of them, the buttons call other different colors.

Abraham Getzler

unread,
Mar 3, 2016, 5:19:11 PM3/3/16
to MIT App Inventor Forum
The problem with using simple lists to match up buttons, colors, and images,
is that you have to go to a lot of trouble to make sure everything is at the same index
in every list.

I see Magenta button is not at the same index as Magenta color, and Magenta image,
for example.

This can be avoided by using a two dimensional list of lists, 
((button, image, color),...), and using more advanced list operations.

Or just go back and rearrange all the lists to keep them in sync.

ABG

Jose Juan Gutierrez

unread,
Mar 4, 2016, 11:27:00 AM3/4/16
to mitappinv...@googlegroups.com


Good morning! Irearranged the buttons to match the index in the brush, aplñash and buttons lists. This is what I´ve got until now;

How can I include the notifier to  show some text in this app? I was thinking on a hovering notice since there is not enough space for another button.



Abraham Getzler

unread,
Mar 4, 2016, 12:20:18 PM3/4/16
to MIT App Inventor Forum
This would be a good question for a new thread.

Consider using invisible arrangements, the title bar, a progress notifier and a clock to dismiss it, or switching to sprites instead of buttons to save on screen real estate.  You don't have to show everything all the time.

Follow the (?) link next to the Notifier component in the Designer GUI Components drawer to get info on the many kinds of Notifiers.

ABG

Jose Juan Gutierrez

unread,
Mar 4, 2016, 12:28:26 PM3/4/16
to MIT App Inventor Forum
I´m going to start a new thread on the subject. Thanks Abraham and Scott, you´ve given me great help on this! I appreciate.
Reply all
Reply to author
Forward
0 new messages