search

LayoutFarm / HtmlRenderer

C# HTML Layout and HTML Rendering Engine
http://layoutfarm.github.io/HtmlRenderer/
Other
185 stars 40 forks source link

add ability to add custom elements #15

Open furesoft opened 6 years ago

furesoft commented 6 years ago

like ...

adds fastcoloredtextbox as control

prepare commented 6 years ago

@furesoft ,

Thank you for your interest.

It is easy and the HtmlRender already has that capability

but it is hidden in the code :)

If you want to do that please visit class MyCustomCssBoxGenerator ( see https://github.com/LayoutFarm/HtmlRenderer/blob/master/Source/LayoutFarm.YourHtmlWidget/5_HtmlBox/MyCustomCssBoxGenerator.cs#L10)

and this is an extensible point. (https://github.com/LayoutFarm/HtmlRenderer/blob/master/Source/LayoutFarm.YourHtmlWidget/5_HtmlBox/MyCustomCssBoxGenerator.cs#L24)

The code demonstrates "custom control" for input tag and canvas tag (both are implemented with PixelFarm's UI control) you can add other tags.

prepare commented 6 years ago

I will show an example here.

Let's begin with

08_test3_mixhtml

_Test3MixHtml => 00.html test case

The current Acid1 test page should look like this ...

09_acid1_sample

Acid1 test page shows 2 gray boxes (input controls) after 'bang' and 'whimper'

the code that renders the 2 small boxes is here (https://github.com/LayoutFarm/HtmlRenderer/blob/master/Source/LayoutFarm.YourHtmlWidget/5_HtmlBox/MyCustomCssBoxGenerator.cs#L131)

Now, modify it with this ...

html_ext3

in red box, test it, I change bg-color to red and add 'child /sub' label with text 'R'

Run again,

html_ext2

That's it

prepare commented 6 years ago

Above, in this version, all controls are 'Windowless' control.

Do you want 'Window/ Native' control ?

prepare commented 6 years ago

If you want to add more MyCustomCssBoxGenerator or replace it

please see here: https://github.com/LayoutFarm/HtmlRenderer/blob/master/Source/Test3_MixHtml/HtmlHostCreatorHelper.cs#L34

furesoft commented 6 years ago

can i add winforms controls?

prepare commented 6 years ago

It is possible. But I need some modification, because in this version all controls are 'Windowless'.

But I'm also thinking about adding a 'Window' control too. There are 2 ways.

  1. Direct embed the control into the host. => in this way the 'Windowless' object can't show on top of it.

  2. Indirect embed the control => hide actual control, and copy Hdc of it and render into a dedicated html element object. and route mouse/keyboard event to the actual control.

What do you think about it?

furesoft commented 6 years ago

yes thats a good idea