enisn / UraniumUI

Uranium is a Free & Open-Source UI Kit for MAUI.
Apache License 2.0
1.19k stars 143 forks source link

Editor instead of Entry in AutoFormView #745

Closed NiX3r closed 3 months ago

NiX3r commented 3 months ago

Hey there 👋 I'm just curious if there is some attribute to set input as editor? I need to be Description as editor (need to be visually multiline and can input new lines)

I've got this. But DataType does not seems work ..

[Editor]
[DataType(DataType.MultilineText)]
[Display(Name = "Popis")]
[MaxLength(2048)]
public string Description { get; set; }

And this is how I'm calling it

ContactFormViewModel form = new ContactFormViewModel()
{
    FlatNumber = model.Contact.FlatNumber,
    FirstName = model.Contact.FirstName,
    LastName = model.Contact.LastName,
    Email = model.Contact.Email,
    Phone = model.Contact.Phone,
    BankNumber = model.Contact.BankNumber,
    Type = (ContactType)model.Contact.Type,
    Description = model.Contact.Description,
};

var result = await model.DialogService.DisplayFormViewAsync("Úprava kontaktu", form);

And lastly .. I sent u email, but I will try this way either. Can I build Discord server for you for your projects? I think it will be much easier to help with issues and communicate with your community 💪

NiX3r commented 3 months ago

Both of you @TerminatedGA and @rphmauriciodev are reported 💪

enisn commented 3 months ago

This is an experimental feature and we'll improve the usage, but for now it uses reflection, you can add some configuration to use different components:

MauiProgram.cs

builder.Services.Configure<AutoFormViewOptions>(options =>
{
    options.EditorMapping[typeof(string)] = (property, propertyNameFactory, source) =>
    {
        var propertyName = propertyNameFactory(property);

        var dataTypeAttribute = property.GetCustomAttribute<DataTypeAttribute>();

        if (dataTypeAttribute != null && dataTypeAttribute.DataType == DataType.MultilineText)
        {
            var textArea = new EditorField();
            textArea.SetBinding(EditorField.TextProperty, new Binding(property.Name, source: source));
            textArea.Title = propertyName;
            return textArea;
        }

        var editor = new TextField();
        editor.Title = propertyName;
        editor.SetBinding(TextField.TextProperty, new Binding(property.Name, source: source));
        return editor;
    };
});

I'll enhance this experience, but currently you can configure it manually according to your requirements

NiX3r commented 3 months ago

This is an experimental feature and we'll improve the usage, but for now it uses reflection, you can add some configuration to use different components:

MauiProgram.cs

builder.Services.Configure<AutoFormViewOptions>(options =>
{
    options.EditorMapping[typeof(string)] = (property, propertyNameFactory, source) =>
    {
        var propertyName = propertyNameFactory(property);

        var dataTypeAttribute = property.GetCustomAttribute<DataTypeAttribute>();

        if (dataTypeAttribute != null && dataTypeAttribute.DataType == DataType.MultilineText)
        {
            var textArea = new EditorField();
            textArea.SetBinding(EditorField.TextProperty, new Binding(propertyName, source: source));
            textArea.Title = propertyName;
        }

        var editor = new TextField();
        editor.Title = propertyName;
        editor.SetBinding(TextField.TextProperty, new Binding(property.Name, source: source));
        return editor;
    };
});

I'll enhance this experience, but currently you can configure it manually according to your requirements

Hey .. that works. But I have to append return textArea in if statemnet

And what about that Discord? Or is it pasé?

enisn commented 3 months ago

Yeah, I gorgot to add return, my bad. 😀 I wrote it in github editor instead IDE.

And what about that Discord? Or is it pasé?

I answered your email, that would be nice 🎉

NiX3r commented 3 months ago

One more thing

I needed change this line

textArea.SetBinding(EditorField.TextProperty, new Binding(propertyName, source: source));

Change propertyName to propert.Name because the binding won't work well 💪

NiX3r commented 3 months ago

Final working code:

builder.Services.Configure<AutoFormViewOptions>(options =>
{
    options.EditorMapping[typeof(string)] = (property, propertyNameFactory, source) =>
    {
        var propertyName = propertyNameFactory(property);

        var dataTypeAttribute = property.GetCustomAttribute<DataTypeAttribute>();

        if (dataTypeAttribute != null && dataTypeAttribute.DataType == DataType.MultilineText)
        {
            var textArea = new EditorField();
            textArea.Title = propertyName;
            textArea.SetBinding(EditorField.TextProperty, new Binding(property.Name, source: source));
            return textArea;
        }

        var editor = new TextField();
        editor.Title = propertyName;
        editor.SetBinding(TextField.TextProperty, new Binding(property.Name, source: source));
        return editor;
    };
});
enisn commented 3 months ago

Thanks 🙏 I updated the first example again 👍