[Free] CompCreator - create component dynamically

Extension to create/remove visible components dynamicly.

BLOCKS

Create:

2022-01-20_192218
Create a visible component in a container.
component: String or Component. component Class Name.
in: Component. where the new component to be created inside.

Remove

2022-01-20_123711
Remove the component from screen. if it's a container component, all his children will be removed.

Children

2022-01-21_195051
Return a list of component container's children.
This can be used for native component containers.
If the component is screen, or already removed, empty list will be returned.

Parent

2022-01-21_195055
Return parent (container) of a component

ListComponents

image
return list of same type in the container.
recursive:boolean. if true, it will return all component with same type. if false, only direct children returned.

SetValue

image

set the property of one specific component.
component: the component to set property. Not a String.
property: String. it can be the following 3 type:

  1. any in-build property name. even some property only show in Design pannel.
  2. "index", this tag will set the showing order of the component in his container.
  3. other string. this will give the component a user-defined property.

value: String. value of the tag.

GetValue

image

get the property's value of a component.

CreateWith

image

Create a batch of components with template. The first/outest component returned.
template: String. a json string descriping the structure of the components. (see below for how to get a template)
in : Component. where the new components to be created inside.
values: properties to replace the template.

HOW TO GET A TEMPLATE

a template is a json string like:
Snipaste_2022-01-20_13-07-02

  1. At designer panel, you drag and drop the component, and make the layout as you wish, set all necessary properties.

  2. select the component (normally a container, but one single component is OK) in the Viewer or component tree, press Ctrl+C. (lools like this only work at MIT server, not Kodular)

  3. go to Blocks panel, drag out a "empty string" block, and presse Ctrl+V to paste the template inside the block.

  4. if we want to change the property in the template, replace the origin by {1}, {2}, {3}...
    for example, we want to change the Text and TextColor, we can change the template like this:
    image

  5. feed the values socket with new property values

OnClick and OffClick

image

OnClick will bind a click event to a component like label, button, or even an arrangement.

This one have high priority than native event.

1647234255331504

DOWNLOAD LINK

[take me download website]

EXAMPLE

25 Likes

good extension

Thanks for the color bug fix and the template option:+1:

now more confusing :upside_down_face:
component made sense...and prevents extension update to existing...

2 Likes

ok i will change back :joy: in one hour

edit: updated.

2 Likes

Does template work in kodular ?

I have a quick test, and found it's working in Kodular, but you need to write your template from scratch, since Kodular can not use CTRLC+CTRLV to get the template.

But what is button version and uuid

ok i forget to mention the $Name, $version, Uuid, $blocks are useless in this template, you can delete them, or just leave them there, they will be ignored anyway.

the $Components and $Type is needed. and other perperty name.

You can make extension for create from scratch , so that it will easy for kodular users

What do you mean? which function do you want to achieve?

Sorry, this is MIT App Inventor Community. It will get off topic if you talk about another builder in this forum. If you want to talk to the extension developer about Kodular, please private message him.

3 Likes

Ok sir @gordonlu310

1 Like

two methods (Children and Parent) added.

3 Likes

How can I jusfity all the sentences in order to be all lines in the same size. like this:
image
readerDisplayDynamic.aia (159.6 KB)

save all the buttons (or labels) to a list, then use for each item block and Any Button(Any Label) to set it's font size.

Would you please show me the block to know how to do that.

Osama asked for justifying, not for sizing

I noticed that for this app you have asked a lot of questions and every time you want a direct block.

Pls read some basic tutorial and do it by yourself. Already tell you how to do.

I am sorry to bother you Kevinkun.
Would you please give some more details to know the idea of how to justify the sentences

what's mean? TextAlignment for label? this is only for horizontally. there is no vertical alignment for label. You need to put label inside an arrangement and set arrangement's AlignVertical.