Add/Remove components/Widgets from logic

[Ivano Da Milano]

Hello everyone.
I have a last question about AppInventor.

Is it possible to add/remove widgets/components from the logic code?

Example use case:
I have a dynamic list of properties/widgets, the template is still the same (let's say I have a textview and a checkbox), I'd like to generate this template more than once, virtually infinite, or at worse, 0 times.
Now, if I were on SketchWare, I could be add a view and then initialize it with a list, then in the screen I want this to show up I just have to populate the list.

Is this possible with AI?

Thanks in advance for any help.

Bye, Ivano.

[Ghica]

The answer is simply: No. 

You cannot dynamically add visible items to a screen.

Cheers, Ghica.

[Ivano Da Milano]

This is crucial, and definitely needed to create some kind of apps.
Please, add it. As I said, SketchWare already have this.

[Hossein Amerkashi]

@Ghica,

Actually, we have an extension called DynamicComponent, hat allows you to dynamically create Buttons, Labels, Checkboxes, TexBoxes on the fly. It does-have limitations, such as setting width/height, and does not have all the features of the said components, but, for simple requirements, it'll do the job and has features such as Clicked or Checked, etc.

See attached image, using 1-block, it dynamically created Label, Button, Textbox.

-Hossein.

AppyBuilder.com

[Ivano Da Milano]

Please, link it.
Sounds interesting.

[Ivano Da Milano]

P.S.: It would be better if the widget to be added could be laid in a screen.

[Hossein Amerkashi]

@Ivano,

Yes, it can be added to screen as visible components.

You can get it from HERE that also includes sample .aia and .apk

[Ivano Da Milano]

No, I were meaning the opposite:
Define a series of widgets in a screen and then add them all in another screen.

[Ivano Da Milano]

Think about a group of widgets, add the whole group after defining it inside a screen.

[Ghica]

Do you really want to do that? Usually it is the sign of a bad design when you copy screen contents in this way.

You could use the MergeTool, or some tricky stuff using 7-zip and note++ to copy screens.

Reed this: http://ai2.appinventor.mit.edu/reference/other/manyscreens.html

Cheers, Ghica.

[Ivano Da Milano]

No, it's meant just to create widgets groups and then add/remove dinamically.
E i have a download with a label (file name), a progress bar (completion) and a button, I'd create the group once in a separate screen and "paste" it in whatever screen I need to.

I don't know how to explain, maybe you could give utorrent a try and see, per each download there's a widget group created by code and you can have from 0 to virtually unlimited.

[Ghica]

I know what you mean, I do not do utorrent, and did you read the text I linked to?

Cheers, Ghica.

[Ivano Da Milano]

I read it, but, again, it's not what I was looking for.
I need to have such widget group in a single screen, from 0 of them to infinite.
Please, try utorrent for a couple of minutes, things will be more clear if you do.

[Ivano Da Milano]

Have a look at this mockup example, it should clear up everything.

In Widgets group.png, a Widget blueprint is created in a screen, that won't be showed at runtime, but kept for reference by the App.
Then, in another screen, (see Groups instantiated.png) the BluePrint gets created more than once.

Using traditional method, I would have created multiple instances of the BluePrint and set them invisible, constraining me to a maximum number of available entries.
With dynamic instancing, I can have 0 or more of my BluePrints inside a Screen, without necessarily draw them by hand.

Is this clear, now?

[Italo]

Why Hossein's extension is not what you need?

[Ivano Da Milano]

Because isn't flexible enough, too little options for widgets

[Italo]

What do you mean by "widgets"? Widgets are not possible in App Inventor.

Do you mean "components"?

[Ivano Da Milano]

Buttons, labels, and so

[Italo]

Those are components, not widgets, and you can create those at runtime with Hossein's extension. It's just a little more work, but it's possible.

[Ivano Da Milano]

As I said, there aren't enough customization options in that extension

[Chris Ward]

You can do it in native Android of course, check out Android xml too. You can also do it Spider Basic, a lot easier. 

Since SketchWare can do it, what makes it unsuitable for your project? 

It would be great if run-time components could be a feature of AI but I think it would be difficult to incorporate.

[Ivano Da Milano]

Where something is good one side, the same is bad on the other, and vice versa.
Ai is more feature rich, sw allows more complex tasks.

[Ghica]

You should keep in mind That App Inventor is an educational tool and not a production tool. That said, it can do amazing things.
Also, App Inventor is open source, therefore, you can add anything you like. If enough other people like it, maybe someone from MIT integrates it into the core App Inventor. Many people made useful extensions, although visible ones, like you want, are not straightforward to do yet.
Finally, use another tool, if that tool has functions you like! With Android studio you can do anything, but at the price of learning Java and becoming an expert at it.

But I would encourage you to make a few apps using App Inventor first. Instead of being stuck on a feature you insist on, doing some actual development may change your perspective and you may find out that it was not so important after all.
Cheers, Ghica

[Ivano Da Milano]

I see what are you talking about, in fact these posts are just proposals for anyone who is developing AI to add what I suggest.
Excuse me, but I can't imagine even the simpler 2D game without a UDT containing X and Y values, and a 2 dimensions array of images for the game map.

[Ivano Da Milano]

Sorry, I just noticed I went OT.
Well, dynamic GUIs are certainly important, because I could need in eg to make a button appear if I check a checkbox.
There are so many more examples I could quote...

[SteveJG]

If you want to develop a 2D game with App Inventor you might read this article 

• Chapter 17. Creating Animated Apps

App Inventor is not designed as a Game Engine.  There are compilers made by others can do that.  However, AI is capable of developing 2D games.

We want you to get the most with App Inventor so here are some resources to help you learn to use the existing AI2 tools  A very good way to learn App Inventor is to read the free Inventor's Manual here in the AI2 free online eBook   http://www.appinventor.org/book2 ... the links are at the bottom of the Web page.  The book 'teaches' users how to program with AI2 blocks. It is helpful even to people are experienced in programming in other languages because AI does many things in non traditional programming ways.

There is a free programming course here http://www.appinventor.org/content/CourseInABox/Intro  and the aia files for the projects in the book are here:  http://www.appinventor.org/bookFiles  

How to do a lot of basic things with App Inventor are described here:  http://www.appinventor.org/content/howDoYou/eventHandling  .

Examples of some 2D games are here  http://appinventor.mit.edu/explore/ai2/tutorials showing that are made using the Canvas component and App Inventor 'arrays' ... that are Lists of Lists.

Regards,

Steve

[Ivano Da Milano]

Ok, I bookmarked everything.
But ATM I'm only interested in features, because I'd not invest any time with AI if I'm not 101% sure is what I'm looking for.
Let's drop the game side for a moment, but I'd like to use AI instead of Java, because, even if I have some C/C++, I have very much problems using it.
Idem goes for Java, I'd like something like, indeed, AI (or SketchWare by the way)

Please, briefly answer my questions, don't let me skim the various (there are many) manuals/articles.

I tried to get answers from Google and I had, but not everything is in there and something is neither implemented (and I don't know if it will).

So, again, thanks for your time and your patience.

[Chris Ward]

 I could need in eg to make a button appear if I check a checkbox.

You can do that, because the button can be initially set as hidden. 

[Ivano Da Milano]

This has already been discussed above.
I don't need to just set the visibility of a button, because if I had 20s of them, how should I manage the thing?

Better approach would be to have a dynamic list of buttons and add/remove them when needed.

[Chris Ward]

Better approach would be to have a dynamic list of buttons and add/remove them when needed.

That would require almost identical code needed to show/hide if AI2 could do add/remove. However AI2 can handle a good many components and, for example, you can create a list of Buttons and then reference them by index.in Procedures, a slick way to manage them.

So the main difference is that you would have to manually define the layout of the buttons rather than dynamically in a loop. Of course that loop is easier, but you lose some control of the GUI overall, which, unlike a form on Windows, could be critical on a small device like a phone - and they come in all shapes and sizes of course.

[Ivano Da Milano]

Finally, this is *exactly* what I was looking for.

Thanks a lot.