Gallery that have items with several different layouts

[AnonymusUser22]

Hi, new here and new ot powerapps.

I want to show the user a list of instructions in specific order. Some instructions will just be text. "open this", do that".. kind of thing.

Some will require the user to take a pictue with the phone and will upload it to sharepoint,

others will require to to provide input back using some input controls.

I do not want to hard code the list of instructions as future changes will be required over time.
and if i have several versions of these lists I would like them to use the same databse table to collect the user inputs.   

So I thought of using a gallery and nesting different custom somponent Based on the data the gallery gets. 

so if the record item callery calls fir layout A it will insert custom component A , if it is B it will be component B and so one. I will provide in the record the values each component need as an input and also the names of the fields that will get the values emitted by the component .

but galleries have a uniform look to all items.

So I thought of creating several custom component each with its own set of input and output properties and layout. 

the data will be something like 
table(
{component:"A", inputValues:{"HeaderText: "start", instructionText:"Do this as the start"}} outputvalues:{},
{component:"B", inputValues:{"HeaderText: "compare to picture", instructionText:"See Picture ",picturename),outputvalues:{}},

{component:"C", inputValues:{"HeaderText: "temperature Sensor", instructionText:"Write 4 readings of body temperature"},outputvalues:{tepe1,temp2,temp3,temp4}},

{component:"A", "HeaderText: "bla bla bla", instructionText:"Do that"});

Then have a logic like
switch (component type ,
in case of "A" insert (component A),
"B" insert (component B),
"C" insert (component C )). 

Trying to create a single component that has all these layouts stacked one on top of the other will be a nightmare for me. as there can be many. I would rather spend the time making differnt layouts as component and keep them static then progrematically  trting to make one extremly smart component.

the reason I want to use a gallery is becuase I would like to be able to provide the instruction in a sequence, I want teh user to scroll through the list of instructions, and I want the flexibility to add new ones or delete some in an easy way.  

however I am not sure how to do that. or if it is possible.
I understand that a gallery accept a table and placethem in a template layout so the Items property of the gallery will point to the table .
But I am not sure how program the switch-insert combination or in what property of the item.  

[WiZey]

Hello @AnonymusUser22 ,

You could use containers.

Create one container in your gallery per type of instructions you have, and switch their visibility property based on the component related to the instruction in your gallery.

That way you can easily manage all your components, and edit/add/remove more in the future.

Hope this was helpful to you.

[AnonymusUser22]

I was hoping to be able to populate a different element but this approach will work too. Thank you.

Any chance to get suggestion for a process to build the database easily?

[WiZey]

I don't think there is an "easy" structure for the database, but more like a "lazy" structure as each record will have to:

1. Memorizes the component type
2. Stores one or many columns for each type of component

This will result in a weird-looking table, but that's my hot take on the most efficient database when working with this kind of app.

Basically, the table could look like this:

ID	Component	TypeA_Value1	TypeA_Value2	TypeB_Value1	TypeB_Value2	TypeB_Value3	TypeB_Value4	TypeC_Value1	TypeC_Value2	TypeC_Value3
1	A	Text 1	Text 2
2	B			FALSE	FALSE	TRUE	TRUE
3	C							Text 1	Text 2	Image