Creating HTML scenes

[Danielo515]

Hello,

I was just wondering if it is possible to use webviews to create cool GUIs. I know they are often used to display web pages, but I think creating normal GUI, whit buttons if they were a normal Tasker scenes would be a killer feature. 

If this is already possible, could someone point me to some examples or manuals related?

Thanks in advance.

[Pent]

I was just wondering if it is possible to use webviews to create cool GUIs. I know they are often used to display web pages, but I think creating normal GUI, whit buttons if they were a normal Tasker scenes would be a killer feature. 

Didn't totally understand what you want, but you can show HTML in a webview and respond to button presses etc with javascript. The javascript has access to a lot of
Tasker functions.

Pent

[Danielo515]

Hello Pent,

Thanks for your answer. 

What I want is to create HTML scenes like it were normal tasker scenes. I'm experimenting a lot with javascript and that's why I want to try this out. How should I react to the button press ? With normal JS events? Can webview scenes have the same functionality than a normal one? I suppose the answer is yes, but I just want to be sure.

How should be the very basic HTML?

Thanks for your support.

[Wietse van Buitenen]

I remember I have tested an HTML file with an external css file a few months ago and it worked fine..

[Danielo515]

Could you detail your exact configuration?

Where and how do  you link to the external CSS file? In the HTML? Using what notation? file:/// maybe? What kind of actions does your javascript performs?

Thanks for your answer

[Pent]

What I want is to create HTML scenes like it were normal tasker scenes.

You can't do that, because there is no HTML scene editor in Tasker.

However, there are millions of HTML tools available elsewhere...

Pent

[Danielo515]

Hello Pent.

Sorry for the misunderstood. I mean having the same functionality ("power") than normal scenes: writing to files, creating calendar entries, launching other tasks.... I was not talking about the way they are created ☺

[Bob Hansen]

See this:

Tasker: JavaScript Support

[Danielo515]

Guys,

I have read already all the manuals you posted. I appreciate the effort, but I'm just asking a very concrete question because I'm not sure what is the answer from what I read.

I created lot of javascript scripts, so I'm pretty aware of what JS can do. But regarding scenes, what I have read is that webviews are used just to display webpages. What I want to know if all what is available for Javascript is available for webviews. I'm aware of the limitations of accessing variables. Is that the only limitation? 

Can I, for example, create a complete GUI tat looks like an application, or a tasker scene with just webviews and Javascript?

[Brandon Horwath]

But regarding scenes, what I have read is that webviews are used just to display webpages. What I want to know if all what is available for Javascript is available for webviews. I'm aware of the limitations of accessing variables. Is that the only limitation?

I know what you're asking here, I'm not sure if you'll get an answer.

Not many tasker users seem to be proficient or utilize custom scenes, and of those who do webview type elements seem to be less common. I would also say, java is not a very common tasker function utilized by most or at least not a novice or average user.

You're looking for some insight concerning a very specific aspect of a certain feature.

To be honest, you're probably one of the more qualified individuals to provide some user information regarding what you're asking. That is to say, experienced and proficient to pioneer into this unexplored realm of tasker by most... and let us know what you find.

[Pent]

Can I, for example, create a complete GUI tat looks like an application,

No, because applications use native widgets and an HTML page won't.
 

or a tasker scene with just webviews and Javascript?

You can do that, yes.

Webview JS has access to Tasker global variables.

Pent

[Wietse van Buitenen]

Could you detail your exact configuration?

Where and how do  you link to the external CSS file? In the HTML? Using what notation? file:/// maybe? What kind of actions does your javascript performs?

I have a WebView with Mode set to File, there I select an HTML file (/sdcard/htmltest/test.html).

In that HTML file, links to .css files and .js files are hardlinked (/sdcard/htmltest/css/custom.css) in the href.

It's possible that there are other ways but this is the only one I tested (a short test).

[Danielo515]

Thank you for the kind words Brandon,

I'm doing some test with JQueryUI and I have a couple of questions:

• The only display mode that is working properly is full display no bars. But the problem is, there is no android top bar.
• Any other display mode doesn't fill the full width, so it looks awful.
• In the middle of the scene a grey transparent circle is displayed. Like if you were on a normal computer emulating a mobile screen. Does anyone why?
• After a couple of seconds, the scene closes itself. Why?
• How can I create scenes that fills all the screen but no the bottom and top bars? 

Thanks in advance.

[Danielo515]

I solved the grey dot issue, it was related to JQUeryMobile, what about the oter problems?

• The only display mode that is working properly is full display no bars. But the problem is, there is no android top bar.
• Any other display mode doesn't fill the full width, so it looks awful.

• After a couple of seconds, the scene closes itself. Why?
  
• How can I create scenes that fills all the screen but no the bottom and top bars? 

Thank you 

[Sean Williams]

Not really sure what you mean exactly. Maybe post some screen shots?

[Danielo515]

Sure.

I searched into this forum and there are some (old) complaints about this.

In the screenshot you can see white bars at both sides of the screen. If you look carefully, at the bottom, next to the footer you can even see some launcher icons.

[Sean Williams]

Ok so is that's a single webview shown as an activity?

I believe the bars you see are the background colour in the scene properties.

[Sean Williams]

For the bars to be removed you need to reduce the height of your scene to include your phones notification bar. Just use trial and error until you find the correct amount.

A Tasker scene is like a container with a locked aspect ratio. This scales well across devices by expanding or contracting to the lowest dimensional value. However on some devices you will inevitably have a certain amount of background on view.

For you to avoid this being so apparent you can use a variable as the scenes background colour and the same variable in your CSS.

[Jay M]

Or you could use the screen info feature found in this app to get the perfect height ;)

https://play.google.com/store/apps/details?id=com.electricsheep.asi

Jay M

--
You received this message because you are subscribed to the Google Groups "Tasker" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tasker+un...@googlegroups.com.
Visit this group at http://groups.google.com/group/tasker.
For more options, visit https://groups.google.com/d/optout.

[Danielo515]

Hello,

Reducing the height by 70px did the trick. What will happen if I use this profile in a different phone with a different resolution? Should I change size manually?

[Sean Williams]

It the resolution is different it will probably need adjusting.

[Brandon Horwath]

Most likely needs adjusting.

A lot of users report webview elements don't scale at all, even on their own device :/

If it's any consolation, good rule of practice is giving yourself 10% margin of error either side of defined resolution for target device. Should minimize the number of redundant scenes within the project, hopefully.