I want to display an HTML / CSS / Javascript animation on the webkit browser (WebView). This works good, but for any reason the animation freezes sometimes, when i drag the window or a Scroll Bar on the application form. A Slider for example dont do a freeze.
How to fix this?
i have recorded a Video to show you the Problem:
Thank you!
No Idea why this freezes?
There are some other workarounds possible.
I just need a up to date browser control which supports my html5 / css / JavaScript animations. And i also need a possibilty to execute JavaScript.
If i use the “native” renderer from HTMLViewer Control (Windows 7), my displayed web content doesn’t work correctly, the animation doesn’t play and i cant execute JavaScript from external (xojo). Btw: The native renderer doesnt freeze after draging window or a a scroll bar.
If i use WebkKit renderer instead, all works fine, but than i got the Problem shown in my first post (The Control freezes if i dragging some controls or a the window - This could be a bug from xojo or the control itself ?)
If i cant prevent the freeze i need a new HTMLViewer control.
Are there any free webkit based controls available which run on Windows and mac which i can use instead (and support my wished: Execute JavaScript from xojo)?
The webkit control is chromium embedded (i forget which version) not the multi threaded version as that has its own set of issues.
I can’t think of any reason it would hang
The "native" renderer is whatever version of the IE engine installedI have installed Internet Explorer 11 (This can display my animations correctly). I think xojo is not using the newest installed IE or it blocks some functions - dont know.
Whatever, it would be the best, if the WebBrowser comes with the Application itself, to get the best representation on all PC’s or Operating Systems.
What i didnt understand is, why the control with with webkit renderer only freezes sometimes, and not every drag.
Have you tried putting a MS Webbrowser control in your project?
I am fairly sure this code works to ensure the latest MSIE is used:
https://forum.xojo.com/21584-webbrowser-msie-version-setting/p1#p180142
This is indeed the case. Under Windows 10 which is using IE 11, with this I get Internet Explorer 4 :
HTMLViewer1.ExecuteJavaScript("var N= navigator.appName, ua= navigator.userAgent, tem;")
HTMLViewer1.ExecuteJavaScript("alert(N+'_'+navigator.appVersion); ")
I remember reading somewhere on this forum a way to make HTMLViewer behave like the true version of IE, but could not find it back. Maybe another member can help.
That said the solution from Peter Job is a good one. I used it in the past and the control is light years away more advanced than the crudish HTMLViewer. Even if it does require learning its features.
Thanks for your current help, but at this time, I only got a worse workaround but not a final solution.
Just for explanation to understand my goal a little bit more:
I want to program a Tool, which can manipulate some Web-Animations. It means it loads different .html sites, which displays different effects. in Xojo yourself, you can modify some parameters. For example you can send over “ExecuteJavascript” from xojo with some scroll bars (RGB each) some color parameters, to change the Effekt color. At the end it should be like a visualization, which runs to audio or can be manipulated manually. I just want to use HTML / CSS / Javascript for my Animations, because with this way, everyone can create his own animations and can use them in my tool.
My created html sites are very special, because the use a lot of css effects, which you can later modify over xojo with javascript. I want that the user can manipulate as much parameters as possible. The Problem is, different browser engines are showing different results. So its impossible to create animations, which are looking in every browser similar. Internet Explorer is shit, because it doesnt run on Mac and it displays different results as Chrome or Safari. If i could use a WebKit based browser (like the HTMLViewer with WebKit renderer, hopefully without freeze on drag), it would be the best way to show my Websites correctly and identically on every System. Chrome and Safari are also WebKit based.
For similar results across the different platforms, I would recommend switching to the WebKit browser… The scrollbars that are causing the issue, are they ones displayed with the HTMLViewer control or on of Xojo’s that is used to control the HTMLViewer? Seeing as Xojo is single threaded and the HTMLViewer is single threaded, you will probably get issues like this popping up elsewhere as well…
If you can, dump the scrollbar and use a custom page panel in your HTML to navigate between your different example animations…
To force IE out of compatibility mode use this meta tag in the header of your HTML
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> The Scroll Bars that are cuasing the issue are xojo controls (Sliders btw working, but there aren’t vertically).
I want to display the animation on a second Display (prefered a Video-Projektor or a big TV). At the end it should be an Visualization Software, to show cool stuff on an Party-Event. Thats also the reason why its so importent that the animation didnt should freeze while dragging a window or using a scroll bar
[quote=185603:@peter fricke]The "native" renderer is whatever version of the IE engine installed
I have installed Internet Explorer 11 (This can display my animations correctly). I think xojo is not using the newest installed IE or it blocks some functions - dont know.
[/quote]
It could be running in compatibility mode which makes it behave like an older version
[quote=185603:@peter fricke]Whatever, it would be the best, if the WebBrowser comes with the Application itself, to get the best representation on all PC’s or Operating Systems.
[/quote]
Cant do that with IE but webkit is for exactly that reason
Dont know
If it does this on OS X at least there is a nice tool to sample the process & see whats going on
But on Windows I’m not aware of anything that can do that
There may be
Amazing, i have found this Chromium Engine with an included ActiveX Control (It doesnt run out of the box, but after i changed some lines it works good with Xojo. Originally it was created for VB6):
https://github.com/mobileFX/WebKitX/tree/master/CEF/CEF1
I think this Engine is mostly or extactly the same, as Xojo used in his WebKit renderer.
But the difference between Xojo’ and this Webkit HTML-Viewer is, that this one works perfectly!!!
No freeze anymore when dragging the application window or a Scroll-Bar. Also ExecuteJavascript works really nice and fast.
I recorded an Video to Show you the Performance (The less FPS are produces due the recording-tool, normally it runs smooth):
http://klomeister.eimer-24.de/Daten/HTML_Viewer_Comparison.mp4
So you can see:
WebKit ActiveX - Everything fine
Xojo WebKit Engine - Freezes if drag window or a scroll bar
Xojo Native (Internet Explorer 11) - Very slow if executing Javascript (no smooth movements / transitions possible), different look
… Why isnt Xojo able to do the same as the “WebKit ActiveX can”?
Fascinating!
What did you have to change to make it work? I’d love to give it a go.
@peter fricke - can you please show us your worklow implementing this gorgious control?
For now I think it’s a perfect replacement for the Webkit Renderer on Windows - and it seems to be OpenSource.
So why not share the way of implementation with us and maybe it will be added, to the XOJO OpenSource Site?!
BR