Git Product home page Git Product logo

Comments (6)

TimLariviere avatar TimLariviere commented on May 28, 2024 2

You might be interested by TimLariviere/Fabulous#25
There, I tried to create something similar touseElmish that would be compatible with Fabulous and support bidirectional communication (receive messages from outside the loop and send messages to outside the loop).

Let me know if this is the concept you need.
And if the API (usability) makes sense to you.

from fabulous.xamarinforms.

TimLariviere avatar TimLariviere commented on May 28, 2024 1

Thanks for the feedback!

I fear it will take a few months before I can add that feature, since it is dependent on the new architecture I've been playing with.
I need to do a few things before being able to implement that.

Currently my priorities are as follow:

  • Complete the picture for the new shapes controls (PR fabulous-dev/Fabulous#782)
  • Migrate the documentation website to Fornax
  • Reduce allocations in Fabulous
  • Rework the experiments to take into account the optimizations done for the allocations
  • Write the specifications to implement the new architecture (that would enable that new feature) while being backward-compatible with the existing DSL.
  • ... and finally implement bit by bit the new architecture and the new features.

from fabulous.xamarinforms.

TimLariviere avatar TimLariviere commented on May 28, 2024

@JordanMarr Unfortunately no, not currently at least. I don't think Xamarin.Forms even support it at all.
On which platform do you need to open a new window, WPF?

from fabulous.xamarinforms.

JordanMarr avatar JordanMarr commented on May 28, 2024

I only need to target WPF. It doesn't necessarily have to be two separate windows, as much as the ability to run multiple loops at the same time. What I would love to be able to recreate is the experience in Fable.React of being able to create multiple views with their own dispatch loops. This makes it so much easier to have a multi-page app because you don't have to deal with wiring up all the messages. This has become a staple for me.

In React, each view is declared as a function component, and I can use a function like "useReducer" or "useElmish" to start up an isolated dispatch loop just for that view. This makes it trivial to have multiple views, where each view is somewhat isolated and self-contained by having its own dispatch loop.

/// EditUserDialog.fs
module EditUserDialog

type Model = { User: User }
type Msg = | Load | Save | Cancel ...
let init (user: User) = ...
let update msg model = ...

type Props = { IsDialogOpen: bool; User: User; OnSave: User -> unit }

let dialog = React.functionComponent(fun (props: Props) ->   
    let model, dispatch = React.useElmish(init props, update, [||])

    div [ Visible model.IsDialogOpen ] [ 
        div [] [
            label [] [ str "First Name:" ]
            input [ Value model.User.FName ]
        ]
        div [] [
            label [] [ str "Last Name:" ]
            input [ Value model.User.LName ]
        ]
        div [] [
            button [ Click (dispatch Save) ] [ str "Save" ]
        ]
    ]
)
/// UsersPage.fs
module UsersPage

type Model = { ... }
type Msg = | ListUsers | EditUser ...
let init () = ...
let update msg model = ...

let page = React.functionComponent(fun () ->   
    let model, dispatch = React.useElmish(init props.Type, update, [||])

    div [] [
        for user in model.Users do 
            ...

        EditUserDialog.dialog 
            { IsDialogOpen = model.SelectedUser.IsSome
              User = user
              OnSave = (fun user -> dispatch (UpdateUser user)) }        
    ]
)

The "downside" in this approach is that you have multiple disparate dispatch loops as opposed to one unified loop.
But really, this doesn't feel like a downside to me, and the ease of adding introducing new views more than makes up for it.

from fabulous.xamarinforms.

JordanMarr avatar JordanMarr commented on May 28, 2024

That looks very promising!

In the CounterApp sample, I really like AboutCard.asComponent(model.Count, CardChanged). The way you are splicing that view element directly into the view is exactly what I had in mind.

The optional withExternalMessages is a pretty slick way of routing messages back to another view.

This looks great!

from fabulous.xamarinforms.

JordanMarr avatar JordanMarr commented on May 28, 2024

Any chance of this fabulous feature making making it into a release in the near future?

from fabulous.xamarinforms.

Related Issues (19)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.