Component sample with Elmish.XamarinForms

ElmishXamarinForms-ComponentSample.fs

module MyComponent =
	type Msg = | Increment | Decrement

	type Model = { Count : int }

	let init () = { Count = 0 }

	let update msg model =
		match msg with
		| Increment -> { Count = model.Count + 1 }
		| Decrement -> { Count = model.Count - 1 }

	let view model dispatch =
		View.StackLayout(
			children=[
				View.Label(text="Count:")
				View.Label(text=(string model.Count))
				View.Button(text="Increment", command=(fun () -> dispatch Increment))
				View.Button(text="Decrement", command=(fun () -> dispatch Decrement))
			]
		)

module MyPage =
	type Msg = | MyComponent1Msg of MyComponent.Msg
			   | MyComponent2Msg of MyComponent.Msg
			   | OtherMsg

	type Model =
	{
		MyComponent1Model: MyComponent.Model
		MyComponent2Model: MyComponent.Model
		OtherData: string
	}

	let init () =
		{
			MyComponent1Model = MyComponent.init ()
			MyComponent2Model = MyComponent.init ()
			OtherData = "Other data"
		}

	let update msg model =
		match msg with
		| MyComponent1Msg msg ->
			let m = MyComponent.update msg model.MyComponent1Model
			{ model with MyComponent1Model = m }
		| MyComponent2Msg msg ->
			let m = MyComponent.update msg model.MyComponent2Model
			{ model with MyComponent2Model = m }
		| OtherMsg ->
			{ model with OtherData = "Some other data" }

	let view model dispatch =
		View.ContentPage(
			content=View.StackLayout(
				children=[
					MyComponent.view model.MyComponent1Model (MyComponent1Msg >> dispatch)
					MyComponent.view model.MyComponent2Model (MyComponent2Msg >> dispatch)
					View.Label(text=model.OtherData)
				]
			)
		)

module App =
	type Msg = | MyPageMsg of MyPage.Msg

	type Model =
	{
		MyPageModel: MyPage.Model
	}

	let init () =
		{
			MyPageModel = MyPage.init ()
		}

	let update msg model =
		match msg with
		| MyPageMsg msg ->
			let m = MyPage.update msg model.MyPageModel
			{ MyPageModel = m }

	let view model dispatch =
		View.NavigationPage(
			pages=[
				MyPage.view model.MyPageModel (MyPageMsg >> dispatch)
			]
		)