edongashi / WpfMaterialForms

Dynamically generated forms and dialogs in WPF
MIT License
51 stars 14 forks source link

DatePicker and TimePicker side by side #1

Closed rc201612 closed 7 years ago

rc201612 commented 8 years ago

Cool library.

Is it possible at this point to create a MaterialForm that can have multiple controls per row? I'm looking at getting a TimePicker beside a DatePicker.

If not, is there something that would enable this on the roadmap?

Thanks.

edongashi commented 8 years ago

Hello!

Currently items are stacked vertically within a single column.

A quick solution I can think of is to create a new schema/view pair suited to display date+time controls sharing the same row. The value of said schema can be mapped to a plain DateTime since it holds both components. I will implement this when I find the time within the next one or two days and I will notify you when I do so.

If complex layout spanning multiple schemas is required, we have to think of a simple way to describe it without digging into complex wpf stuff like templating.

In the meantime you can inherit SchemaBase and provide your custom views for whatever other data type you require. Plug those schemas to your form and it does the rest. If you implement common controls you are welcome to send pull requests.

Thank you!

rc201612 commented 8 years ago

That's what I ended up doing - although what I did was quick and a bit dirty, I can smarten it up and submit a PR for a DateTimePicker within the next couple of days.

It's not something I need urgently, it's just something I was having a play around with.

I do think it would be cool if it could handle columns though, i.e. large forms that may be displayed fullscreen. It doesn't always have to be time and date near each other, it could be a combobox and textbox.

edongashi commented 8 years ago

Hello, I implemented row sharing without breaking current API. Insert a MultiSchema in your MaterialForm (the number of children is unlimited).

new MultiSchema(
    new DateSchema { Name = "Date", IconKind = PackIconKind.CalendarClock },
    new TimeSchema { Name = "Time" })
{
    RelativeColumnWidths = new[] { 6d, 4d }
}

The optional RelativeColumnWidths allows specifying custom star widths for the generated columns. By default, all columns have an equal width. In the above example {6,4} means the date picker takes 60% of the total width and the time picker the other 40%

The MultiSchema's GetValue() returns a MaterialForm built from its contents. This type of nesting was required as it was not possible to map multiple keys for a single schema. The returned form gives access to the column elements.

Nevertheless, the DateTime picker should be implemented natively to provide more ease of use. I will do so soon.

Check out 4581e02a6b39a9f4b41fa225ef07dc532ae274d1 and ShowMultiSchema in the WpfDemo. Let me know your thoughts. Thanks!

rc201612 commented 7 years ago

Apologies it's been a while!

Looks good to me :) Exactly as I'd envisaged.

Thanks.