how can i make grid like this pic ?

  


I want to create a grid like that, do I have to use List, List items, columns, or other options?

And how do I make the data in excel?

Hello Arvin

I think a Table Records widget will be enough to display the grid you want

To display the top left corner I think you can create a Web Block with that layout and call it on the Table Records


Regards,

Ângelo Sousa

Hi

You can check here how to split it https://stackoverflow.com/questions/45506550/how-can-a-split-diagonally-a-table-header-cell

Best Regards,

Marcelo

Ângelo Sousa wrote:

Hello Arvin

I think a Table Records widget will be enough to display the grid you want

To display the top left corner I think you can create a Web Block with that layout and call it on the Table Records


Regards,

Ângelo Sousa

Hi Angelo,

Thanks for your help, but.
I can not find a table record widget, is it for mobile or web app? because i need this for mobile app.

Regards,

Arvin Fairuz

Marcelo Ferreira wrote:

Hi

You can check here how to split it https://stackoverflow.com/questions/45506550/how-can-a-split-diagonally-a-table-header-cell

Best Regards,

Marcelo


Thanks for your help Marcelo , this is very helpful.

Best Regards,

Arvin

Hello Arvin

I'm sorry I didn't realize you were talking about mobile app, my mistake.

Regards,

Ângelo Sousa

Hi Arvin,

Mobile apps (especially those that display on a phone) typically don't have tabular data because of the small screen size. I don't think there's anything out-of-the-box in SilkUI, but I haven't checked thoroughly.

Hi Kilian & Angelo,


Can you help me, how to create a screen like above?


Thanks,

Imas 

Hello Imas

Is the number of rows and columns fixed or is it dynamic? 

If it is fixed, I think you can design a grid-like screen (with the columns widget or even with containers) and fill each "cell" with a webblock. If it is dynamic, like Kilian said, mobile apps don't have any pattern for tabular display.

As for the creation of the data in Excel, you can easily do it via bootstrap (https://success.outsystems.com/Documentation/10/Developing_an_Application/Use_Data/Data_Transformation/Bootstrap_Data_from_Excel_Files - this is a web example, but it works the same way for mobile apps)


Regards,

Ângelo

Hi Angelo,


Ângelo Sousa wrote:

Hello Imas

Is the number of rows and columns fixed or is it dynamic? 

If it is fixed, I think you can design a grid-like screen (with the columns widget or even with containers) and fill each "cell" with a webblock. If it is dynamic, like Kilian said, mobile apps don't have any pattern for tabular display.

As for the creation of the data in Excel, you can easily do it via bootstrap (https://success.outsystems.com/Documentation/10/Developing_an_Application/Use_Data/Data_Transformation/Bootstrap_Data_from_Excel_Files - this is a web example, but it works the same way for mobile apps)


Regards,

Ângelo

Table above is dynamic, can the mobile apps can enter the web page in the screen? if in android nativ like webview.

Maybe you have any solution ?


Thanks,

Imas 


Hello Imas

I'm sorry, I don't understand your question. Can you please clarify?


Regards,

Ângelo

Hi Angelo,


Ângelo Sousa wrote:

Hello Imas

I'm sorry, I don't understand your question. Can you please clarify?


Regards,

Ângelo

In the mobile app I want to open a web page and I put it on the mobile application screen I created, can it be outsystems?


Thanks,

Imas Deny 


Hello Imas


Do the table and web page already exist or are you creating them? Either way, yes, you can redirect  your mobile app to that URL using the External Site widget


Regards,

Ângelo

Hi Angelo,


Ângelo Sousa wrote:

Hello Imas


Do the table and web page already exist or are you creating them? Either way, yes, you can redirect  your mobile app to that URL using the External Site widget


Regards,

Ângelo

I have not create the table, I think the above table is taken from the web and displayed on the screen.

So can't make such a display in mobile app outsystems, but can on the web, right?


Thanks,

Imas Deny 


Hi Imas

Correct. You can create the table in a web app, deploy it, and then create a link on your mobile app using the External Site widget to redirect the user to the page where you put the table

I'm not sure if this a common issue or solution, but I think it's feasable.

Let me know if you have any issues while creating the table or the link


Regards,

Ângelo

Hi Angelo,


Ângelo Sousa wrote:

Hi Imas

Correct. You can create the table in a web app, deploy it, and then create a link on your mobile app using the External Site widget to redirect the user to the page where you put the table

I'm not sure if this a common issue or solution, but I think it's feasable.

Let me know if you have any issues while creating the table or the link


Regards,

Ângelo

Maybe the problem is what if i want to scroll to left right but label column name freeze, and when scroll up down, row header name freeze, the header name and column name dynamic, how to solve it ?


Thanks,

Imas Deny


Hi Imas,

If you want to display a web page inside your application, use the InAppBrowser plugin.

Hi Kilian 

Kilian Hekhuis wrote:

Hi Imas,

If you want to display a web page inside your application, use the InAppBrowser plugin.

I've tried using this plugin, but when I try this plugin open screen is not in the screen apps like image below 


whether InAppBrowser plugin can be used like the picture above ?

then i tried this way: https://success.outsystems.com/Documentation/Development_FAQs/How_to_Reuse_Web_Screens_in_Mobile_Apps.

so i found the problem how to make diagrammatic above on the web?


Thanks

Imas Deny 


Hi imas,

I find it a bit difficult to understand what you mean. From the image, I'd say you didn't tell the component what web page you want it to display.