Skip to content

Commit

Permalink
.
Browse files Browse the repository at this point in the history
  • Loading branch information
@TimLariviere
TimLariviere committed Dec 7, 2023
1 parent c22454b commit f7ab3d6
Show file tree
Hide file tree
Showing 4 changed files with 68 additions and 62 deletions.
74 changes: 40 additions & 34 deletions samples/Components/HelloComponent/App.fs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,90 +9,96 @@ open type Fabulous.Maui.View
[<AutoOpen>]
module AppEnvironmentKeys =
let CountKey = EnvironmentKey("Count", 0)

type EnvironmentKeys with

static member Count = CountKey

open type Fabulous.Maui.EnvironmentKeys

module App =
let themeViewer() =
let themeViewer () =
Component() {
let! theme = Environment(Theme)

VStack() {
Label($"[themeViewer] Current theme is %A{theme.Current}")
Button("[themeViewer] Toggle theme", fun () ->
theme.Set(
if theme.Current = AppTheme.Light then
AppTheme.Dark
else
AppTheme.Light
)

Button(
"[themeViewer] Toggle theme",
fun () ->
theme.Set(
if theme.Current = AppTheme.Light then
AppTheme.Dark
else
AppTheme.Light
)
)
}
}
let subCountViewer() =

let subCountViewer () =
Component() {
let! count = Environment(Count)
Label($"[SubCountViewer] Count = {count.Current}")
}
let subCountSetter() =

let subCountSetter () =
Component() {
let! count = Environment(Count)

VStack() {
Button("[SubCountSetter] Increment", fun () -> count.Set(count.Current + 1))
Button("[SubCountSetter] Decrement", fun () -> count.Set(count.Current - 1))
Button("[SubCountSetter] Increment", (fun () -> count.Set(count.Current + 1)))
Button("[SubCountSetter] Decrement", (fun () -> count.Set(count.Current - 1)))
}
}
let subCount() =

let subCount () =
(Component() {
VStack() {
subCountViewer()
subCountSetter()
}
})
.environment(Count, 10)
let countViewer() =

let countViewer () =
Component() {
let! count = Environment(Count)
VStack() {
Label($"[CountViewer] Count = {count.Current}")
}
VStack() { Label($"[CountViewer] Count = {count.Current}") }
}
let countSetter() =

let countSetter () =
Component() {
let! count = Environment(Count)

VStack() {
Button("[CountSetter] Increment", fun () -> count.Set(count.Current + 1))
Button("[CountSetter] Decrement", fun () -> count.Set(count.Current - 1))
Button("[CountSetter] Increment", (fun () -> count.Set(count.Current + 1)))
Button("[CountSetter] Decrement", (fun () -> count.Set(count.Current - 1)))
}
}
let count'() =

let count' () =
Component() {
VStack() {
countViewer()
countSetter()
}
}

let view() =
let view () =
(Component() {
let! count = Environment(Count)
let! theme = Environment(Theme)

Application() {
ContentPage() {
VStack() {
Label($"[view] Current theme is %A{theme.Current}")
Label($"[view] Count = {count.Current}")
Button("[view] Increment", fun () -> count.Set(count.Current + 1))
Button("[view] Decrement", fun () -> count.Set(count.Current - 1))
Button("[view] Increment", (fun () -> count.Set(count.Current + 1)))
Button("[view] Decrement", (fun () -> count.Set(count.Current - 1)))

count'()
subCount()
themeViewer()
Expand All @@ -101,8 +107,8 @@ module App =
}
})
.environment(Count, 0)
let createMauiApp() =

let createMauiApp () =
MauiApp
.CreateBuilder()
.UseFabulousApp(view)
Expand Down
17 changes: 10 additions & 7 deletions src/Fabulous.MauiControls/Component.fs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,20 +11,23 @@ module Component =
BaseComponent.setComponentFunctions(
(fun view -> (view :?> BindableObject).GetValue(ComponentProperty) :?> IBaseComponent),
(fun view comp ->
let previousComp = BaseComponent.getAttachedComponent view
let previousComp =
(view :?> BindableObject).GetValue(ComponentProperty) :?> IBaseComponent

if previousComp <> null then
previousComp.Dispose()

(view :?> BindableObject).SetValue(ComponentProperty, comp)
)

(view :?> BindableObject).SetValue(ComponentProperty, comp))
)

[<AutoOpen>]
module ComponentBuilders =
type Fabulous.Maui.View with

static member inline Component<'marker>() = ComponentBuilder()
static member inline Component<'msg, 'marker>() = ComponentBuilder<'msg, 'marker>()

static member inline MvuComponent(program: Program<unit, 'model, 'msg>) = MvuComponentBuilder(program, ())
static member inline MvuComponent<'msg, 'marker, 'cMsg, 'cModel>(program: Program<unit, 'cModel, 'cMsg>) =
MvuComponentBuilder<'msg, 'marker, unit, 'cMsg, 'cModel>(program, ())

static member inline MvuComponent(program: Program<'arg, 'model, 'msg>, arg: 'arg) = MvuComponentBuilder(program, arg)
static member inline MvuComponent<'msg, 'marker, 'cArg, 'cMsg, 'cModel>(program: Program<'cArg, 'cModel, 'cMsg>, arg: 'cArg) =
MvuComponentBuilder<'msg, 'marker, 'cArg, 'cMsg, 'cModel>(program, arg)
36 changes: 16 additions & 20 deletions src/Fabulous.MauiControls/Environment.fs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,33 +9,30 @@ open type Fabulous.Maui.View

[<AbstractClass; Sealed>]
type EnvironmentKeys =
class end
class
end

module Theme =
let Key = EnvironmentKey("Theme", AppInfo.RequestedTheme)

let initialize (env: EnvironmentContext) =
env.Set(Key, Key.DefaultValue, false)


let initialize (env: EnvironmentContext) = env.Set(Key, Key.DefaultValue, false)

let subscribe (env: EnvironmentContext) (target: obj) =
let app = target :?> Application

let fromSource =
app.RequestedThemeChanged.Subscribe(fun args ->
env.Set(Key, args.RequestedTheme, false)
)

app.RequestedThemeChanged.Subscribe(fun args -> env.Set(Key, args.RequestedTheme, false))

let toSource =
env.ValueChanged.Subscribe(fun args ->
if args.Key = Key.Key && args.FromUserCode = true then
let newValue =
match args.Value with
| ValueNone -> AppTheme.Unspecified
| ValueSome value -> value :?> AppTheme

app.UserAppTheme <- newValue
)


app.UserAppTheme <- newValue)

{ new IDisposable with
member _.Dispose() =
fromSource.Dispose()
Expand All @@ -44,15 +41,14 @@ module Theme =
[<AutoOpen>]
module EnvironmentBuilders =
type EnvironmentKeys with

static member Theme = Theme.Key

module EnvironmentHelpers =
let initialize (env: EnvironmentContext) =
Theme.initialize env

let initialize (env: EnvironmentContext) = Theme.initialize env

let subscribe (env: EnvironmentContext, target: obj) =
let theme = Theme.subscribe env target

{ new IDisposable with
member _.Dispose() =
theme.Dispose() }
member _.Dispose() = theme.Dispose() }
3 changes: 2 additions & 1 deletion src/Fabulous.MauiControls/Program.fs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,11 +84,12 @@ module Program =
fun (env, target) ->
let fab = program.Environment.Subscribe(env, target)
let maui = EnvironmentHelpers.subscribe(env, target)

{ new IDisposable with
member this.Dispose() =
fab.Dispose()
maui.Dispose() } }

{ Program = { program with Environment = env }
View = view
CanReuseView = MauiViewHelpers.canReuseView
Expand Down

0 comments on commit f7ab3d6

Please sign in to comment.