Recent

Author Topic: Insert html in pas2js_Widget  (Read 373 times)

cappe

  • Full Member
  • ***
  • Posts: 143
Insert html in pas2js_Widget
« on: April 09, 2021, 10:23:10 am »
I wanted to know what is the best way to put html code in a twform in a certain position (eg at coordinates x = 10, y = 20).


Thank you

PascalDragon

  • Hero Member
  • *****
  • Posts: 2972
  • Compiler Developer
Re: Insert html in pas2js_Widget
« Reply #1 on: April 09, 2021, 02:01:39 pm »
I have not tested it, but you could use e.g. a TWPanel and then add your HTML to that control's TJSHTMLElement.

What is it you're trying to achieve?

cappe

  • Full Member
  • ***
  • Posts: 143
Re: Insert html in pas2js_Widget
« Reply #2 on: April 09, 2021, 02:23:34 pm »
What is not available in the pas2js_witget components I add via html. It would be more interesting if you learn how to write the pas2js_widget components. I was looking for a vertical selection bar.

Another question, when I created a frame, how do I insert it into the twform?
« Last Edit: April 09, 2021, 02:27:12 pm by cappe »

PascalDragon

  • Hero Member
  • *****
  • Posts: 2972
  • Compiler Developer
Re: Insert html in pas2js_Widget
« Reply #3 on: April 10, 2021, 03:53:07 pm »
What is not available in the pas2js_witget components I add via html. It would be more interesting if you learn how to write the pas2js_widget components. I was looking for a vertical selection bar.

You can essentially do it like this:
  • inherit from a suitable base type (e.g. TControl or TWinControl)
  • override and implement CreateHandleElement: this will be where you create the root element of your component (e.g. a div and then add any required sub elements
  • override Change to apply any changed properties to your component hierarchy (look at the existing components to see what I mean)
  • put your component into a Lazarus runtime(!) package that depends on the WCL
  • if you want to use your component at design time you need to additionally implement a dummy LCL component for your web component with the same name (look at design/source/webctrls.pas for examples)
  • put your design time component in a separate designtime(!) package that deponds on WCLDsgn (!)
  • install that designtime package in the IDE

Does this help you further? (this should probably be beautified and extended and put up in the WCL's Wiki on GitHub...)

Another question, when I created a frame, how do I insert it into the twform?

I have not tested adding frames at design time yet (you did inherit from TWFrame?), but you can instantiate it at runtime and set the Parent to the form (you can of course design your frame using the IDE designer).

 

TinyPortal © 2005-2018