Perspective: Designing a "table" for mobile and PC

Hmm, I just tried this, but I’m not seeing any options to use an embedded View instead of a table row.

There’s a sub-view property but that seems to be attached to a table row, it doesn’t replace the look of the row itself.

Create a one column table, where each cell is a json including the parameters you need

Then reference that in your embedded view from params.value

I’m just jumping back onto this and finally found where you were talking about all along RE the viewPath in the column config of the Table. Cool!
However, I’m struggling to pass my 4 params to my view…
I can see that there are view params you can pass that are under table.columns[0].viewParams, however it seems that this applies to every row (i need different params per row).

This is what I have:
image

and this is what i’ve tried in the data for pass the params (SitePath, TankFarm, TankPrefix, TankNumber) - passing just the TankNumber should suffice for testing as the rest are defined with default values:
image

These keys and values within the EmbeddedView object have no impact on what’s displayed.
However, as soon as I add some values into the columns section, all rows are updated with those values:
image

I tried this as well:
image

The user manual is confusing:

Tried adding a ‘value’ key as the user manual says you need for object array elements…
image

Second question: how do I set the height of the rows?

@cmallonee @PGriffith

Got it. I found this in the user manual… not very obvious, also very strange to implement, see the blank “EmbeddedView” object:

image
The reason there’s an empty “EmbeddedView” key is so that it’s associated with the EmbeddedView column… I have no idea what would happen if I wanted to have multiple columns where each one used an embedded view with the same params (and if so, what if those params needed different values??)

and my Embedded View params definitions:
image

I still have no idea how to set the height of the rows though… currently each row is full screen height, or there abouts (very tall!)


(that’s almost a single row, some cut off the bottom)
This is what it’s supposed to be:
image

Adding cells.style.height as per this post ([FEATURE-16567] Perspective Table Row Height - #3 by Paul.Scott) yields straaange results…

So a few things, you can either access view.params.rowData on the embedded view to get all of that rows data, or you can access view.params.value to get just that cells value in that column.

What I do in This case is turn my single column into a json dictionary, so that each “cell” is a whole dictionary worth of data

Make sure that useDefaultViewHeight Is true, and then make the defaultHeight of your view equal to the smallest height you’ll need. If it’s a pain to work on the view at that point while the height is so short, create a binding on the defaultHeight prop that looks at your session.props.deviceType (I think that’s what it is) and see if it’s equal to “designer”. If it is then map it to the tallest height you need, and if it’s not then default to the shortest height

Do you know where that should be defined?

This is on the embedded view itself, and it may be self.view.props.defaultHeight but I would have to look

Whoops I can’t read, thought you said defaultHeight, i thought it was in the table column props, but if it’s not I would have to load up a designer and check. Try just doing the minimum height thing, you may not need the useDefaultViewHeight

Nah there’s nothing to do with height in the column :frowning:
image

There’s nothing to do with height anywhere at all that I can find, in any of the properties :frowning: :frowning: (that was the property that I expected to see, useDefaultViewHeight). It’s weird how in your example you posted the height of the items is ok, but mine is 10 times taller than the default…

Change the actual default height of your embedded view to something like 40 (it will look bad, but see if it fixes it)

I did include a copy of my test here as well, so you may need to grap that and figure out whats not the same

You’re right, it looked terrible haha, but it still didn’t change the height of the rows :frowning:
I had a look at your example to work out how you did the embedded view :slight_smile: i’ll see if there’s anything else in there that’s different, as you say.

I found the issue with Travis’ help. My embedded view was a flex container set to row. You can’t set the height of a row flex, only the width, and some of the components I used don’t “know” their height, so when put into the table they don’t show the height you’re expecting (it sounded more technical coming from Travis’ mouth…)
Anyway, to resolve it (at least for now), I changed the embedded view to column flex, added a row flex container to it where I cut and paste all my content into, and then set the basis of the row flex container to the height I wanted it to be. Then voila, it showed up that height in the Table :slight_smile:

2 Likes

Ahhh, I thought it was a column container. A column container does have an “awareness” of its height in this way as well