Custom native control wrappers

How-to Discussions
1

Hi,

I’m trying to upgrade DatePicker from old Fuse to 0.20. I’ve followed the guide here https://www.fusetools.com/docs/native-interop/native-ux-components

First of all this gives me an error:

extern(!iOS) public class MySlider: LeafView

After replacing LeafView with Panel I still get an error when trying to compile for iOS:

.uno/DatePicker.g.uno(38.13): E3104: 'iOSDatePicker' does not contain a member called 'Name'. Could you be missing a package reference?
.uno/DatePicker.g.uno(39.13): E3104: 'iOSDatePicker' does not contain a member called 'Bindings'. Could you be missing a package reference?
.uno/datepicker_example.unoproj.g.uno(5.66): E2047: No implicit cast from 'iOSDatePicker' to Uno.UX.PropertyObject

My attempt is here: https://github.com/bolav/fuse-datepicker

2

Hi,

Use LeafView, not Panel. What

Second, LeafView is currently not a Node, so it doesn’t support bindings when it is the root element in a template or calss (as of 0.21). I see though that we should probably make View extend Node to support this use case.

Currently, the native views are implemented by passing an interface to the host down to the implementation and doing the bindings manually in Uno code. Here is how the iOS slider is implemented: https://gist.github.com/Duckers/2a5a080bb54d6288931948a9764f7997

3

Also, check this out :slight_smile:

https://github.com/fusetools/fuse-samples/tree/feature-DatePicker/Samples/NativePickers

4

This is what uno says when I enter LeafView for extern(!iOS):

iOSDatePicker.uno(9.43): E3114: There is nothing named 'LeafView' accessible in this scope. Did you perhaps misspell 'ILeafView' (as in Fuse.Controls.Native.ILeafView)?  Could you be missing a package reference?
5

It would be good if you also describe what you mean by host in this context.

6

Hi Bjørn-Olav,

Sorry that this thread got forgotten. Do you still have this problem?

7

Hi,

Yes. I still don’t know how to implement this in Fuse 0.2x, and have not seen any working best practice examples.

8

Did you look at the sample?

9

Yes. That does not follow the pattern outlined here: Custom native control wrappers for UX markup, and does not use ux:Template, or ux:Class.

The Native.DatePicker class extends Panel, and not LeafView as the documentation says it should, and which @duckers also says should work.

Also I would like to have a description of what you mean with host.

10

“host” is probably just referring to the code in my example https://github.com/fusetools/fuse-samples/blob/feature-DatePicker/Samples/NativePickers/DatePicker.uno#L12 https://github.com/fusetools/fuse-samples/blob/feature-DatePicker/Samples/NativePickers/DatePicker.uno#L25