This is a migrated thread and some comments may be shown as answers.

Responsive Layout Container

3 Answers 135 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Anthony
Top achievements
Rank 1
Veteran
Anthony asked on 16 Dec 2020, 09:50 PM

For the past few months, I have been experimenting with React and Material UI and put one very simple application into production.

I am working on my second app which will be an online membership application.  It will need masked inputs for things such as dates, SSN# and credit cards.   This is where Mui started to fall short.   My company already licenses the DevCraft bundle for a WPF project so I started digging into Kendo.  It has all the controls I need and others I didn't even thinks of using.

My initial question isn't about the controls, but to point me in a direction for best practices responsive layout containers.  Mui has Grid (not to be confused with a Data Grid), boxes and Container which helps with that.

It's not clear to me how you do this with Kendo.   Do you have any articles to share.  

 

Thanks

Anthony

3 Answers, 1 is accepted

Sort by
0
Accepted
Stefan
Telerik team
answered on 18 Dec 2020, 02:40 PM

Hello, Anthony,

KendoReact has a different layout component that can be helpful in this case:

https://www.telerik.com/kendo-react-ui-develop/components/layout/

One of them is our new TileLayout component, which allows dynamic positioning, reordering, and resizing of different containers:

https://www.telerik.com/kendo-react-ui-develop/components/layout/tilelayout/get-started/

The Splitter is also a component that can be useful in this case:

https://www.telerik.com/kendo-react-ui-develop/components/layout/splitter/

In general, for pure layout containers, the developer can be anything that they like, including Material UI with our components inside or pure Bootstrap.

Please let me know if I can provide additional information on this matter.

Regards,
Stefan
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
Anthony
Top achievements
Rank 1
Veteran
answered on 19 Dec 2020, 01:07 AM
Thank you.  This is helpful.

By pure Bootstrap, do you mean using the grid system detailed on its website?
https://getbootstrap.com/docs/5.0/layout/grid/

Does this approach work with all Kendo themes without importing any additional packages?
0
Accepted
Vladimir Iliev
Telerik team
answered on 22 Dec 2020, 08:50 AM

Hello Anthony,

Yes, no additional files are needed and you can directly use this approach. Please note however that our bootstrap theme is designed to blend with bootstrap components/elements and I would suggest to use it if you plan to use more than their grid system.

Also as our themes internally also have grid system, we plan to expose it for clients in future versions, however currently I can't be more specific on the exact time frame when this will happen.

Regards,
Vladimir Iliev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
General Discussions
Asked by
Anthony
Top achievements
Rank 1
Veteran
Answers by
Stefan
Telerik team
Anthony
Top achievements
Rank 1
Veteran
Vladimir Iliev
Telerik team
Share this question
or