Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Gridsplitter properties #364

Merged
merged 6 commits into from
Nov 1, 2023
Merged

Gridsplitter properties #364

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
f439190
Added missing properties to GridSplitter
beyon Oct 24, 2023
a7a8fba
Added GridSplitter demo to controlcatalog
beyon Oct 27, 2023
256a061
Merge branch 'fsprojects:master' into gridsplitter-additions
beyon Oct 30, 2023
43c7fe2
previewContent typechecked
beyon Oct 30, 2023
c7fcb54
Merge branch 'fsprojects:master' into gridsplitter-additions
beyon Oct 30, 2023
2a64001
Added a column gridsplitter, removed unused (commented) code
beyon Oct 31, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions ...uncUI.ControlCatalog/Avalonia.FuncUI.ControlCatalog/Avalonia.FuncUI.ControlCatalog.fsproj
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@
<Compile Include="Views\Tabs\WrapPanelDemo.fs" />
<Compile Include="Views\Tabs\DataTemplateDemo.fs" />
<Compile Include="Views\Tabs\GridDemo.fs" />
<Compile Include="Views\Tabs\GridSplitterDemo.fs" />
<Compile Include="Views\Tabs\CanvasDemo.fs" />
<Compile Include="Views\Tabs\ContextMenuDemo.fs" />
<Compile Include="Views\Tabs\StylesDemo.fs" />
Expand Down
4 changes: 4 additions & 0 deletions src/Avalonia.FuncUI.ControlCatalog/Avalonia.FuncUI.ControlCatalog/Views/MainView.fs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,10 @@ module MainView =
TabItem.header "Grid Demo"
TabItem.content (ViewBuilder.Create<GridDemo.Host>([]))
]
TabItem.create [
TabItem.header "Gridsplitter Demo"
TabItem.content (ViewBuilder.Create<GridSplitterDemo.Host>([]))
]
TabItem.create [
TabItem.header "WrapPanel Demo"
TabItem.content (ViewBuilder.Create<WrapPanelDemo.Host>([]))
Expand Down
256 changes: 256 additions & 0 deletions ...lonia.FuncUI.ControlCatalog/Avalonia.FuncUI.ControlCatalog/Views/Tabs/GridSplitterDemo.fs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,256 @@
namespace Avalonia.FuncUI.ControlCatalog.Views

open System
open Elmish
open Avalonia
open Avalonia.Controls
open Avalonia.Layout
open Avalonia.FuncUI.DSL
open Avalonia.FuncUI
open Avalonia.FuncUI.Elmish

module GridSplitterDemo =
type State =
{ dragIncrement: int
keyboardIncrement: int
customPreview: bool
resizeBehavior: GridResizeBehavior
resizeDirection: GridResizeDirection}

let init () =
{ dragIncrement = 1
keyboardIncrement = 20
customPreview = false
resizeBehavior = GridResizeBehavior.BasedOnAlignment
resizeDirection = GridResizeDirection.Auto}

type Msg =
| SetDragIncrement of int
| SetKeyboardIncrement of int
| SetCustomPreview of bool
| SetGridResizeBehavior of GridResizeBehavior
| SetGridResizeDirection of GridResizeDirection

let update (msg: Msg) (state: State) : State =
match msg with
| SetDragIncrement increment -> { state with dragIncrement = increment }
| SetKeyboardIncrement increment -> { state with keyboardIncrement = increment }
| SetCustomPreview isChecked -> { state with customPreview = isChecked }
| SetGridResizeBehavior behavior -> { state with resizeBehavior = behavior}
| SetGridResizeDirection direction -> { state with resizeDirection = direction}

let gridCellView col row text =
Border.create [
Grid.column col
Grid.row row
Border.background Media.Colors.AliceBlue
Border.borderThickness 2
Border.borderBrush (Media.Colors.Black.ToString())
Border.child (
TextBlock.create [
TextBlock.dock Dock.Top
TextBlock.fontSize 48.0
TextBlock.verticalAlignment VerticalAlignment.Center
TextBlock.horizontalAlignment HorizontalAlignment.Center
TextBlock.text text
]
)
]

let view (state: State) (dispatch) =
DockPanel.create [
DockPanel.children [
TextBlock.create [
TextBlock.dock Dock.Top
TextBlock.margin 5.0
TextBlock.text "GridSplitter properties"
TextBlock.fontSize 24.
]
StackPanel.create [
StackPanel.dock Dock.Top
StackPanel.orientation Orientation.Horizontal
StackPanel.spacing 16.0
StackPanel.children [
StackPanel.create [
StackPanel.orientation Orientation.Vertical
StackPanel.spacing 16.0
StackPanel.children [
DockPanel.create [
DockPanel.lastChildFill false
DockPanel.children [
TextBlock.create [
TextBlock.text "Drag increment:"
TextBlock.dock Dock.Left
TextBlock.margin(0.,0.,16.,0.)
TextBlock.verticalAlignment VerticalAlignment.Center
]
TextBox.create [
TextBox.text (string state.dragIncrement)
TextBox.width 64.
TextBox.dock Dock.Right
TextBlock.margin(0.,0.,16.,0.)
TextBox.onTextChanged (fun text ->
match text |> Int32.TryParse with
| true, inc -> inc |> SetDragIncrement |> dispatch
| false, _ -> ()
)
]
]
]
DockPanel.create [
DockPanel.lastChildFill false
DockPanel.children [
TextBlock.create [
TextBlock.text "Keyboard increment:"
TextBlock.verticalAlignment VerticalAlignment.Center
TextBlock.dock Dock.Left
TextBlock.margin(0.,0.,16.,0.)
]
TextBox.create [
TextBox.text (string state.keyboardIncrement)
TextBlock.width 64.
TextBox.dock Dock.Right
TextBlock.margin(0.,0.,16.,0.)
TextBox.onTextChanged (fun text ->
match text |> Int32.TryParse with
| true, inc -> inc |> SetKeyboardIncrement |> dispatch
| false, _ -> ()
)
]
]
]
]
]
StackPanel.create [
StackPanel.orientation Orientation.Vertical
StackPanel.spacing 16.0
StackPanel.children [
DockPanel.create [
DockPanel.lastChildFill false
DockPanel.children [
TextBlock.create [
TextBlock.verticalAlignment VerticalAlignment.Center
TextBlock.text "Grid resize bahavior:"
TextBlock.dock Dock.Left
TextBlock.margin(0.,0.,16.,0.)
]
ComboBox.create [
ComboBox.dataItems [
GridResizeBehavior.BasedOnAlignment
GridResizeBehavior.CurrentAndNext
GridResizeBehavior.PreviousAndCurrent
GridResizeBehavior.PreviousAndNext
]
ComboBox.dock Dock.Right
ComboBox.horizontalAlignment HorizontalAlignment.Stretch
ComboBox.selectedItem state.resizeBehavior
ComboBox.onSelectedItemChanged (
tryUnbox >> Option.iter(SetGridResizeBehavior >> dispatch)
)
]
]
]
DockPanel.create [
DockPanel.lastChildFill false
DockPanel.children [
TextBlock.create [
TextBlock.verticalAlignment VerticalAlignment.Center
TextBlock.text "Grid resize direction:"
TextBlock.margin(0.,0.,16.,0.)
]
ComboBox.create [
ComboBox.dataItems [
GridResizeDirection.Auto
GridResizeDirection.Columns
GridResizeDirection.Rows
]
ComboBox.dock Dock.Right
ComboBox.horizontalAlignment HorizontalAlignment.Stretch
ComboBox.selectedItem state.resizeDirection
ComboBox.onSelectedItemChanged (
tryUnbox >> Option.iter(SetGridResizeDirection >> dispatch)
)
]
]
]
]
]
]
]
StackPanel.create [
StackPanel.dock Dock.Top
StackPanel.orientation Orientation.Horizontal
StackPanel.spacing 16.0
StackPanel.verticalAlignment VerticalAlignment.Bottom
StackPanel.children [
ToggleSwitch.create [
ToggleSwitch.content "Show Preview"
ToggleSwitch.onContent "Enabled"
ToggleSwitch.offContent "Disabled"
ToggleSwitch.isChecked state.customPreview
ToggleSwitch.onChecked (fun _ -> SetCustomPreview true |> dispatch)
ToggleSwitch.onUnchecked (fun _ -> SetCustomPreview false |> dispatch)
]
]
]
Grid.create [
Grid.columnDefinitions "1*,1*,1*"
Grid.rowDefinitions "1*,1*"
Grid.showGridLines true
Grid.margin(10., 10., 20., 20.)
Grid.children [
gridCellView 0 0 "A"
gridCellView 1 0 "B"
gridCellView 2 0 "C"
gridCellView 0 2 "D"
gridCellView 1 1 "E"
gridCellView 2 1 "F"
GridSplitter.create [
GridSplitter.dragIncrement state.dragIncrement
GridSplitter.keyboardIncrement state.keyboardIncrement
GridSplitter.showsPreview state.customPreview
GridSplitter.resizebehavior state.resizeBehavior
GridSplitter.resizeDirection state.resizeDirection
Grid.column 1
Grid.rowSpan 2
Grid.horizontalAlignment HorizontalAlignment.Left
Grid.verticalAlignment VerticalAlignment.Stretch
Grid.width 5.0
]
GridSplitter.create [
GridSplitter.dragIncrement state.dragIncrement
GridSplitter.keyboardIncrement state.keyboardIncrement
GridSplitter.showsPreview state.customPreview
GridSplitter.resizebehavior state.resizeBehavior
GridSplitter.resizeDirection state.resizeDirection
Grid.column 2
Grid.rowSpan 2
Grid.horizontalAlignment HorizontalAlignment.Left
Grid.verticalAlignment VerticalAlignment.Stretch
Grid.width 5.0
]
GridSplitter.create [
GridSplitter.dragIncrement state.dragIncrement
GridSplitter.keyboardIncrement state.keyboardIncrement
GridSplitter.showsPreview state.customPreview
GridSplitter.resizebehavior state.resizeBehavior
GridSplitter.resizeDirection state.resizeDirection
Grid.columnSpan 3
Grid.row 1
Grid.horizontalAlignment HorizontalAlignment.Stretch
Grid.verticalAlignment VerticalAlignment.Top
Grid.height 5.0
]
]
]
]
]

type Host() as this =
inherit Hosts.HostControl()
do
Elmish.Program.mkSimple init update view
|> Program.withHost this
|> Program.withConsoleTrace
|> Program.run

36 changes: 35 additions & 1 deletion src/Avalonia.FuncUI/DSL/GridSplitter.fs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,4 +10,38 @@ module GridSplitter =
ViewBuilder.Create<GridSplitter>(attrs)

type GridSplitter with
end
/// <summary>
/// Restricts splitter to move a multiple of the specified units.
/// </summary>
static member dragIncrement<'t when 't :> GridSplitter>(value: double) : IAttr<'t> =
AttrBuilder<'t>.CreateProperty<double>(GridSplitter.DragIncrementProperty, value, ValueNone)

/// <summary>
/// The Distance to move the splitter when pressing the keyboard arrow keys.
/// </summary>
static member keyboardIncrement<'t when 't :> GridSplitter>(value: double) : IAttr<'t> =
AttrBuilder<'t>.CreateProperty<double>(GridSplitter.KeyboardIncrementProperty, value, ValueNone)

///// <summary>
///// Gets or sets content that will be shown when ShowsPreview is enabled and user starts resize operation.
///// </summary>
static member previewContent<'t, 'c when 'c :> Control and 't :> GridSplitter>(preview: ITemplate<'c>) : IAttr<'t> =
AttrBuilder<'t>.CreateProperty<ITemplate<'c>>(GridSplitter.PreviewContentProperty, preview, ValueNone)

/// <summary>
/// Indicates which Columns or Rows the Splitter resizes.
/// </summary>
static member resizebehavior<'t when 't :> GridSplitter>(resizeBehavior: GridResizeBehavior) : IAttr<'t> =
AttrBuilder<'t>.CreateProperty<GridResizeBehavior>(GridSplitter.ResizeBehaviorProperty, resizeBehavior, ValueNone)

/// <summary>
/// Indicates whether the Splitter resizes the Columns, Rows, or Both
/// </summary>
static member resizeDirection<'t when 't :> GridSplitter>(resizeDirection: GridResizeDirection) : IAttr<'t> =
AttrBuilder<'t>.CreateProperty<GridResizeDirection>(GridSplitter.ResizeDirectionProperty, resizeDirection, ValueNone)

/// <summary>
/// Indicates whether to Preview the column resizing without updating layout.
/// </summary>
static member showsPreview<'t when 't :> GridSplitter>(value: bool) : IAttr<'t> =
AttrBuilder<'t>.CreateProperty<bool>(GridSplitter.ShowsPreviewProperty, value, ValueNone)
Loading