Image and HTML text scroller - best practice...

Getting into LiveCode for iOS? Ask your questions here.

Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller, robinmiller

Post Reply
PaulMaguire
Posts: 44
Joined: Wed Feb 13, 2013 3:38 pm
Contact:

Image and HTML text scroller - best practice...

Post by PaulMaguire » Thu Mar 21, 2013 2:29 am

Hi.

I'm wondering what the best practice is for doing a simple iOS-native scroller which is basically an image (or Vimeo video, but that's another story) followed by some HTML text (includes inline gfx and links). It seems it should be simple and it seems to be causing me grief which makes me think I'm making things unnecessarily complex:

I get some HTML and set it to the HTMtext of a field.
I have some locally-loaded images and drop an image into the top line of the field (using imageSource) by manipulating the field.
This field is grouped and the group has an iOS scroller script attached.

It's the manipulation of the field to drop the image in that seems a bit flaky and laborious - I'm using either RETURNs or <BR> tags. This seems to work but I have the issue if not being able to resize the image easily, and I can't resize the inline HTML images (how do I do this?). All seems wrong. Is there a better way to do this? Should I se up a group and nest this within a scroller group? I tried this but couldn't get it to work...

Any wisdom appreciated.

Kind regards, Paul.

Jellicle
Posts: 453
Joined: Thu Feb 24, 2011 11:07 am

Re: Image and HTML text scroller - best practice...

Post by Jellicle » Thu Mar 21, 2013 3:50 am

Paul

Scrap the way you are doing it. Instead, start with the browser example stack that comes with LiveCode.

Where it sets the URL for the browser in the card script (iphoneControlSet sBrowserId, "url", "http://www.google.com") substitute a local html file path.

Write that html file yourself (dynamically if it'll change, or statically if it's the same every time).

I use an html template that I store in a field. It contains the top and bottom tags for the document. I write dynamic html in the middle, before writing it out to a file.

Gerry
14" MacBook Pro
Former LiveCode developer.
Now recovering.

PaulMaguire
Posts: 44
Joined: Wed Feb 13, 2013 3:38 pm
Contact:

Re: Image and HTML text scroller - best practice...

Post by PaulMaguire » Thu Mar 21, 2013 11:30 am

Hi.

Thanks for the advice - I knew I was going down the wrong road!

Ok so trying a test implementation of this and immediately hit a wall! I have an HTML page stored in a field and I want to load it as a URL into the native control - how do I do this?

Kind regards, Paul.

PaulMaguire
Posts: 44
Joined: Wed Feb 13, 2013 3:38 pm
Contact:

Re: Image and HTML text scroller - best practice...

Post by PaulMaguire » Thu Mar 21, 2013 2:01 pm

Ok I think I have it - something like:

Code: Select all

   put fld "HTMLtemplate" into tHTML
   iphoneControlDo sBrowserId, "load", "", tHTML
I notice that going down this route that all text formatting is at the mercy of the HTML. This is problematic - I'm taking basic HTML from an existing CMS and displaying it - it's essentially text with the occasional inline image. There is no font formatting info in the HTML.

I'll keep on and see what happens - getting frustrated because I can do this in Director in < 10 mins!

Kind regards, Paul.

Jellicle
Posts: 453
Joined: Thu Feb 24, 2011 11:07 am

Re: Image and HTML text scroller - best practice...

Post by Jellicle » Thu Mar 21, 2013 9:57 pm

Write your html out to a file then load that file. Assuming a file named "mywebpage.html" in the Documents directory:

Code: Select all

   
    put "file://" & specialFolderPath("Documents")&"/"&"mywebpage.html"  into  localURL
    replace " " with "%20" in localURL -- don't ask, just do it :)
    iphoneControlSet ScrollerId, "url", localURL
Can you show us your html code?

Gerry
14" MacBook Pro
Former LiveCode developer.
Now recovering.

Simon
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 3901
Joined: Sat Mar 24, 2007 2:54 am

Re: Image and HTML text scroller - best practice...

Post by Simon » Thu Mar 21, 2013 10:22 pm

-- don't ask, just do it
:D :D :D
Luv this place.

Simon
I used to be a newbie but then I learned how to spell teh correctly and now I'm a noob!

PaulMaguire
Posts: 44
Joined: Wed Feb 13, 2013 3:38 pm
Contact:

Re: Image and HTML text scroller - best practice...

Post by PaulMaguire » Fri Mar 22, 2013 10:50 am

Thanks for tips. But can I write out HTML to a mobile device without any issues? To a working, free-access temp folder?
Apologies for outstanding lameness. Just keen to get this workflow sorted!
BTW:

Code: Select all

 replace " " with "%20" in localURL -- don't ask, just do it :)
I actually know why this is important :-)

Kind regards, Paul.

Jellicle
Posts: 453
Joined: Thu Feb 24, 2011 11:07 am

Re: Image and HTML text scroller - best practice...

Post by Jellicle » Fri Mar 22, 2013 12:45 pm

PaulMaguire wrote:Thanks for tips. But can I write out HTML to a mobile device without any issues? To a working, free-access temp folder?
Yes you can :) check the iOS release notes to learn about the various directories you can write to. They are all private to your app. Also check out "specialfolder" and "default folder" in the dictionary.

Gerry
14" MacBook Pro
Former LiveCode developer.
Now recovering.

PaulMaguire
Posts: 44
Joined: Wed Feb 13, 2013 3:38 pm
Contact:

Re: Image and HTML text scroller - best practice...

Post by PaulMaguire » Fri Mar 22, 2013 1:02 pm

Hey Gerry.
Jellicle wrote:Scrap the way you are doing it. Instead, start with the browser example stack that comes with LiveCode.
Where it sets the URL for the browser in the card script (iphoneControlSet sBrowserId, "url", "http://www.google.com") substitute a local html file path.
Gerry
Some tests here - I need transparency for the browser (the content moves over a common background). I cannot make it transparent, even though I am using:

Code: Select all

 mobileControlSet sBrowserId, "opaque", "false"
It makes the background colour disappear (white) and it becomes grey, but not transparent. What gives?

Really appreciate your help here.

KInd regards, Paul.

Jellicle
Posts: 453
Joined: Thu Feb 24, 2011 11:07 am

Re: Image and HTML text scroller - best practice...

Post by Jellicle » Sat Mar 23, 2013 12:31 am

PaulMaguire wrote:Really appreciate your help here.
Hmmmm. Not sure that I can help. I've never used the opaque for browsers, and to be honest I'm not sure how that would work - isn't the background colour etc of a web page set within the html code of the page?

Gerry
14" MacBook Pro
Former LiveCode developer.
Now recovering.

gpb01
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 281
Joined: Sat Jun 04, 2011 5:41 pm

Re: Image and HTML text scroller - best practice...

Post by gpb01 » Sat Mar 23, 2013 1:41 pm

PaulMaguire wrote: ...
Some tests here - I need transparency for the browser (the content moves over a common background). I cannot make it transparent, even though I am using:
...
Hi Paul, use the UIView "backgroundColor" property and set the alpha channel to 0 (eg. give 0,0,0,0 as a color) and ... you will have transparent background color ;)

See LiveCode iOS Release Notes -> iOS Native Controls -> All controls (UIView) -> Properties

Guglielmo

PaulMaguire
Posts: 44
Joined: Wed Feb 13, 2013 3:38 pm
Contact:

Re: Image and HTML text scroller - best practice...

Post by PaulMaguire » Mon Mar 25, 2013 4:50 pm

Hi Guglielmo (and all)

Thanks for that tip! I was in the process of typing a response asking where I was going wrong (I couldn't make the white background disappear!) but then I cracked it - the sequence of commands to the control has significance - I had no idea. Here is my implementation for anyone who navigates to this thread looking to perform this simple task!

Code: Select all

mobileControlSet sBrowserId, "rect", the rect of group "browser"
mobileControlSet sBrowserId, "autoFit", "false"
mobileControlSet sBrowserId, "canBounce", "true"
mobileControlSet sBrowserId, "url", "file:/Users/Paul/Desktop/HTMLtest.html"
mobileControlSet sBrowserId, "visible", "true"
mobileControlSet sBrowserId, "opaque", "false"
mobileControlSet sBrowserId, "backgroundColor", "0,0,0,0"
Grazie mille! (wait a minute - you're Swiss...)

Kind regards, Paul.

Klaus
Posts: 14182
Joined: Sat Apr 08, 2006 8:41 am
Contact:

Re: Image and HTML text scroller - best practice...

Post by Klaus » Mon Mar 25, 2013 5:45 pm

Hi Paul,
PaulMaguire wrote:...
Grazie mille! (wait a minute - you're Swiss...)
Kind regards, Paul.
they speak italian, french, german and something that sounds like clearing your throat,
which they call "Schwyzerdütsch" (Swiss german), over there, so this is correct I think! :D


Best

Klaus

gpb01
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 281
Joined: Sat Jun 04, 2011 5:41 pm

Re: Image and HTML text scroller - best practice...

Post by gpb01 » Mon Mar 25, 2013 6:05 pm

Klaus wrote: they speak italian, french, german and something that sounds like clearing your throat,
which they call "Schwyzerdütsch" (Swiss german), over there, so this is correct I think! :D
Hi Klaus ... unfortunately I only speak Italian, French and English ... no German :( and ... absolutely not "Schwyzerdütsch" :D :D :D

@Paul : So ... "Grazie mille" is ok ... and reply is "Prego, di nulla" ;)

Guglielmo

Post Reply