Skip to content

Commit a2be0a6

Browse files
edgarfgpedgarfgp
authored
Add support for 11.3.0 features (#289)
* Add support for 11.3.0 features * Update TreeDataGrid * Update DockPanel page * Update Border and samples * Update GridPage samples * Update UniformGridPage * Add WrapPanelsPage * format code * Use Fabulous 3.0.0-pre22
1 parent d1a0e48 commit a2be0a6

File tree

23 files changed

+968
-77
lines changed

23 files changed

+968
-77
lines changed

‎Directory.Build.props‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<DisableImplicitSystemValueTupleReference>true</DisableImplicitSystemValueTupleReference>
77
<ProduceReferenceAssembly>true</ProduceReferenceAssembly>
88
<AvaloniaVersion>11.3.0</AvaloniaVersion>
9-
<FabulousVersion>3.0.0-pre21</FabulousVersion>
9+
<FabulousVersion>3.0.0-pre22</FabulousVersion>
1010
</PropertyGroup>
1111

1212
<!-- Shared NuGet Package info -->

‎extensions/Fabulous.Avalonia.TreeDataGrid/Fabulous.Avalonia.TreeDataGrid.fsproj‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
<Compile Include="TreeDataGrid.Components.fs" />
2828
</ItemGroup>
2929
<ItemGroup>
30-
<PackageReference Include="Avalonia.Controls.TreeDataGrid" VersionOverride="11.0.10" />
30+
<PackageReference Include="Avalonia.Controls.TreeDataGrid" VersionOverride="11.1.1" />
3131
</ItemGroup>
3232
<ItemGroup>
3333
<ProjectReference Include="..\..\src\Fabulous.Avalonia\Fabulous.Avalonia.fsproj" />

‎samples/Gallery/App.fs‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,7 @@ module App =
103103
| GlyphRun
104104
| FormattedText
105105
| TextFormatter
106+
| WrapPanel
106107

107108
[<return: Struct>]
108109
let (|CurrentPage|_|) page =
@@ -203,6 +204,7 @@ module App =
203204
| "GlyphRun" -> ValueSome GlyphRun
204205
| "FormattedText" -> ValueSome FormattedText
205206
| "TextFormatter" -> ValueSome TextFormatter
207+
| "WrapPanel" -> ValueSome WrapPanel
206208
| _ -> ValueNone
207209

208210
[<return: Struct>]
@@ -304,3 +306,4 @@ module App =
304306
| FormattedText -> ValueSome(AnyView(FormattedTextPage.view()))
305307
| TextFormatter -> ValueSome(AnyView(TextFormatterPage.view()))
306308
| ViewBoxPage -> ValueSome(AnyView(ViewBoxPage.view()))
309+
| WrapPanel -> ValueSome(AnyView(WrapPanelsPage.view()))

‎samples/Gallery/Gallery.fsproj‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -159,6 +159,7 @@
159159
<Compile Include="Pages\SpringAnimationsPage.fs" />
160160
<Compile Include="Pages\Vector3KeyFrameAnimation.fs" />
161161
<Compile Include="Pages\CompositorAnimationsPage.fs" />
162+
<Compile Include="Pages\WrapPanelsPage.fs" />
162163
<Compile Include="App.fs" />
163164
<Compile Include="MainWindow.fs" />
164165
<Compile Include="MainView.fs" />

‎samples/Gallery/MainWindow.fs‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -244,6 +244,7 @@ module MainWindow =
244244
TabItem("GlyphRun", GlyphRunPage.view())
245245
TabItem("FormattedText", FormattedTextPage.view())
246246
TabItem("TextFormatter", TextFormatterPage.view())
247+
TabItem("WrapPanel", WrapPanelsPage.view())
247248
})
248249
.reference(sideBar)
249250
.expandedModeThresholdWidth(760)

‎samples/Gallery/Pages/BorderPage.fs‎

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,10 +26,26 @@ module BorderPage =
2626
Border(TextBlock("Border and Background"))
2727
.background(SolidColorBrush(Colors.ForestGreen))
2828
.borderBrush(SolidColorBrush(Colors.BlueViolet))
29-
.borderThickness(4.)
30-
.padding(16.)
29+
.borderThickness(8.)
30+
.backgroundSizing(BackgroundSizing.CenterBorder)
31+
.padding(12.)
32+
.horizontalAlignment(HorizontalAlignment.Center)
33+
34+
Border(TextBlock("Background And InnerBorder"))
35+
.background(SolidColorBrush(Colors.ForestGreen))
36+
.borderBrush(SolidColorBrush(Colors.BlueViolet))
37+
.backgroundSizing(BackgroundSizing.OuterBorderEdge)
38+
.borderThickness(8.)
39+
.padding(12.)
3140
.horizontalAlignment(HorizontalAlignment.Center)
3241

42+
Border(TextBlock("Border and Background"))
43+
.background(SolidColorBrush(Colors.ForestGreen))
44+
.borderBrush(SolidColorBrush(Colors.BlueViolet))
45+
.borderThickness(8.)
46+
.backgroundSizing(BackgroundSizing.OuterBorderEdge)
47+
.padding(12.)
48+
3349
Border(TextBlock("Rounded Corners"))
3450
.borderBrush(Brushes.BlueViolet)
3551
.borderThickness(4.)

‎samples/Gallery/Pages/DockPanelPage.fs‎

Lines changed: 73 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -8,27 +8,76 @@ open type Fabulous.Avalonia.View
88

99
module DockPanelPage =
1010
let view () =
11-
(Dock() {
12-
Rectangle()
13-
.fill(SolidColorBrush(Colors.Red))
14-
.height(100.)
15-
.dock(Dock.Top)
16-
17-
Rectangle()
18-
.fill(SolidColorBrush(Colors.Blue))
19-
.width(100.)
20-
.dock(Dock.Left)
21-
22-
Rectangle()
23-
.fill(SolidColorBrush(Colors.Green))
24-
.height(100.)
25-
.dock(Dock.Bottom)
26-
27-
Rectangle()
28-
.fill(SolidColorBrush(Colors.Orange))
29-
.width(100.)
30-
.dock(Dock.Right)
31-
32-
Rectangle().fill(SolidColorBrush(Colors.Gray))
33-
})
34-
.size(300., 300.)
11+
VStack(spacing = 20.) {
12+
TextBlock("Basic DockPanel")
13+
.fontWeight(FontWeight.Bold)
14+
.fontSize(18.)
15+
.margin(0., 0., 0., 10.)
16+
17+
(Dock() {
18+
Rectangle()
19+
.fill(SolidColorBrush(Colors.Red))
20+
.height(100.)
21+
.dock(Dock.Top)
22+
23+
Rectangle()
24+
.fill(SolidColorBrush(Colors.Blue))
25+
.width(100.)
26+
.dock(Dock.Left)
27+
28+
Rectangle()
29+
.fill(SolidColorBrush(Colors.Green))
30+
.height(100.)
31+
.dock(Dock.Bottom)
32+
33+
Rectangle()
34+
.fill(SolidColorBrush(Colors.Orange))
35+
.width(100.)
36+
.dock(Dock.Right)
37+
38+
Rectangle().fill(SolidColorBrush(Colors.Gray))
39+
})
40+
.size(300., 300.)
41+
42+
TextBlock("DockPanel with Spacing")
43+
.fontWeight(FontWeight.Bold)
44+
.fontSize(18.)
45+
.margin(0., 20., 0., 10.)
46+
47+
(Dock() {
48+
Border()
49+
.width(500.)
50+
.height(50.)
51+
.background(SolidColorBrush(Colors.LightBlue))
52+
.dock(Dock.Top)
53+
54+
Border()
55+
.width(500.)
56+
.height(50.)
57+
.background(SolidColorBrush(Colors.LightGreen))
58+
.dock(Dock.Bottom)
59+
60+
Border()
61+
.width(50.)
62+
.height(400.)
63+
.background(SolidColorBrush(Colors.LightPink))
64+
.dock(Dock.Left)
65+
66+
Border()
67+
.width(50.)
68+
.height(400.)
69+
.background(SolidColorBrush(Colors.LightYellow))
70+
.dock(Dock.Right)
71+
72+
Border().background(SolidColorBrush(Colors.LightGray))
73+
})
74+
.horizontalSpacing(10.)
75+
.verticalSpacing(10.)
76+
.margin(10.)
77+
78+
TextBlock(
79+
"In this example, the DockPanel with spacing shows exactly how the horizontal and vertical spacing properties affect layout. Borders are positioned with the same dimensions as in the C# test case, resulting in proper spacing between elements."
80+
)
81+
.textWrapping(TextWrapping.Wrap)
82+
.margin(0., 20., 0., 0.)
83+
}

‎samples/Gallery/Pages/FlyoutPage.fs‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -92,6 +92,8 @@ module FlyoutPage =
9292

9393
let view () =
9494
Component("FlyoutPage") {
95+
let! _ = Context.Mvu program
96+
9597
VStack(spacing = 15.) {
9698
TextBlock("MenuFlyout")
9799

‎samples/Gallery/Pages/GridPage.fs‎

Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -269,9 +269,125 @@ module GridPage =
269269
.gridColumn(3)
270270
.horizontalAlignment(HorizontalAlignment.Stretch)
271271
}
272+
|> _.showGridLines(true)
273+
|> _.rowSpacing(10.)
274+
|> _.columnSpacing(10.)
275+
272276
}
273277
|> _.isSharedSizeScope(true)
274278

279+
let gridSpacingView () =
280+
VStack(spacing = 20.) {
281+
TextBlock("Grid with Spacing Examples")
282+
.fontWeight(FontWeight.Bold)
283+
.fontSize(18.)
284+
285+
TextBlock("Basic Grid with Spacing (2x2)")
286+
.fontWeight(FontWeight.Bold)
287+
.fontSize(16.)
288+
.margin(0., 0., 0., 5.)
289+
290+
(Grid(coldefs = [ Pixel(100); Pixel(100) ], rowdefs = [ Pixel(100); Pixel(100) ]) {
291+
Border()
292+
.background(SolidColorBrush(Colors.LightBlue))
293+
.gridRow(0)
294+
.gridColumn(0)
295+
296+
Border()
297+
.background(SolidColorBrush(Colors.LightGreen))
298+
.gridRow(0)
299+
.gridColumn(1)
300+
301+
Border()
302+
.background(SolidColorBrush(Colors.LightPink))
303+
.gridRow(1)
304+
.gridColumn(0)
305+
306+
Border()
307+
.background(SolidColorBrush(Colors.LightYellow))
308+
.gridRow(1)
309+
.gridColumn(1)
310+
})
311+
.rowSpacing(10.)
312+
.columnSpacing(10.)
313+
.showGridLines(true)
314+
.margin(0., 0., 0., 20.)
315+
316+
TextBlock("Complex Grid with Mixed Sizing")
317+
.fontWeight(FontWeight.Bold)
318+
.fontSize(16.)
319+
.margin(0., 0., 0., 5.)
320+
321+
(Grid(coldefs = [ Pixel(50); Star; Stars(2); Auto ], rowdefs = [ Pixel(50); Star; Stars(2); Auto ]) {
322+
Border()
323+
.background(SolidColorBrush(Colors.LightBlue))
324+
.gridRow(0)
325+
.gridColumn(0)
326+
327+
Border()
328+
.background(SolidColorBrush(Colors.LightGreen))
329+
.gridRow(1)
330+
.gridColumn(1)
331+
332+
Border()
333+
.background(SolidColorBrush(Colors.LightPink))
334+
.gridRow(2)
335+
.gridColumn(2)
336+
337+
Border()
338+
.background(SolidColorBrush(Colors.LightYellow))
339+
.width(30.)
340+
.height(30.)
341+
.gridRow(3)
342+
.gridColumn(3)
343+
})
344+
.rowSpacing(10.)
345+
.columnSpacing(10.)
346+
.width(200.)
347+
.height(200.)
348+
.showGridLines(true)
349+
.margin(0., 0., 0., 20.)
350+
351+
TextBlock("Grid with Spacing Overflow")
352+
.fontWeight(FontWeight.Bold)
353+
.fontSize(16.)
354+
.margin(0., 0., 0., 5.)
355+
356+
(Grid(coldefs = [ Pixel(30); Star; Star; Auto ], rowdefs = [ Pixel(30); Star; Star; Auto ]) {
357+
Border()
358+
.background(SolidColorBrush(Colors.LightBlue))
359+
.gridRow(0)
360+
.gridColumn(0)
361+
362+
Border()
363+
.background(SolidColorBrush(Colors.LightGreen))
364+
.gridRow(1)
365+
.gridColumn(1)
366+
367+
Border()
368+
.background(SolidColorBrush(Colors.LightPink))
369+
.gridRow(2)
370+
.gridColumn(2)
371+
372+
Border()
373+
.background(SolidColorBrush(Colors.LightYellow))
374+
.width(30.)
375+
.height(30.)
376+
.gridRow(3)
377+
.gridColumn(3)
378+
})
379+
.rowSpacing(20.)
380+
.columnSpacing(20.)
381+
.width(100.)
382+
.height(100.)
383+
.showGridLines(true)
384+
.margin(0., 0., 0., 20.)
385+
386+
TextBlock("Notice how excessive spacing can cause interior cells to have 0 width/height.")
387+
.textWrapping(TextWrapping.Wrap)
388+
.opacity(0.8)
389+
}
390+
275391
let view () =
276392
Component("GridPage") {
277393
let! model = Context.Mvu program
@@ -280,6 +396,8 @@ module GridPage =
280396
TabItem("Grids", gridView1())
281397

282398
TabItem("SharedSizeGroup", gridView2 model.People)
399+
400+
TabItem("Grid Spacing", gridSpacingView())
283401
})
284402
.margin(0., 16.)
285403

‎samples/Gallery/Pages/PopupPage.fs‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,8 @@ module PopupPage =
8080
})
8181
.background(SolidColorBrush(Colors.LightGray))
8282
)
83+
.shouldUseOverlayLayer(true)
84+
.takesFocusFromNativeControl(false)
8385
.onOpened(OnOpened)
8486
.onClosed(OnClosed)
8587
.placement(PlacementMode.Custom)

0 commit comments

Comments
 (0)