Adaptive design in Avalonia #6130
-
Hi. How i can write adaptive design in Avalonia like html markup. Want to use smth like bootstrap. Where i can set coluumns (as now i can set it in grid) and breakpoints for diffrent window size to make view adaptive. (change direction of layout width of elements, etc) |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments 10 replies
-
There is no any specific implementation like bootstrap window size breakpoint in Avalonia, but you are free to implement your own. Previously I did simple approach with subscribing on Window.Bounds property changed and setting style class on the window depending on the width. And later this class was easily accessible from style selectors. You can move this subscription to some kind of attached property as well to reuse later. @wieslawsoltes created behavior based on Behavior SDK (ported from UWP) which does the same, but in a bit convenient way. Example. |
Beta Was this translation helpful? Give feedback.
-
Some examples using style selectors and width breakpoints https://github.com/wieslawsoltes/TilePanelDemo/blob/main/TilePanelDemo/MainWindow.axaml |
Beta Was this translation helpful? Give feedback.
There is no any specific implementation like bootstrap window size breakpoint in Avalonia, but you are free to implement your own.
Previously I did simple approach with subscribing on Window.Bounds property changed and setting style class on the window depending on the width. And later this class was easily accessible from style selectors. You can move this subscription to some kind of attached property as well to reuse later.
@wieslawsoltes created behavior based on Behavior SDK (ported from UWP) which does the same, but in a bit convenient way. Example.