I am using XE7 Rad Studio to build "apps" for Android and IPhone. Focusing on Android for the moment.
According to the requirements, I need to load the HTML inside the application as a resource string.
WebBrowser1.LoadFromStrings(ResourceStrings.HTMLString,'');
//Loads the resource-string successfully.
However in this resource-string I need to load images, and I cant figure out how to do it. I can see in deployment that I have the images loaded into the project {Bitmap_1, Bitmap_2,Bitmap_3}.
How do I complete this line:
resource-string:
...'<a href="/images/im2.bmp"><img id="img2" class="thumbnail" src="/images/im2.bmp" alt="/images/im2.bmp"/></a>'...
Many thanks.
If you read the documentation for LoadFromStrings()
, it says:
Displays HTML string content within the TWebBrowser component.
This method uses the following parameters:
Content: specifies the HTML string to be displayed.
BaseUrl: specifies a path that is used to resolve relative URLs within the loaded page. To clarify, consider the following scenario: this parameter is set to
www.mycompany.com/departments/
, and the loaded page defines a link<a href=’Sales.html’>Sales dept</a>
. In the given case, clicking this link openshttp:// www.mycompany.com/departments/Sales.html
.
That is the exact scenario you are running into. Your HTML contains relative links to external images, but you are not providing a BaseURL
, so the WebBrowser cannot resolve the correct URLs it needs to load those images.
In the Deployment Manager, set the Remote Path of your image files to either StartUp/Documents/images/
or StartUp/Library/Application Support/images/
.
At app startup, Delphi will copy files beginning with StartUp
to the appropriate folder on the device. Then you can do the following when calling LoadFromStrings()
:
// note sure which function to use for 'StartUp/Library/Application Support/',
// maybe TPath.GetLibraryPath()? This example is for '/StartUp/Documents/'...
WebBrowser1.LoadFromStrings(ResourceStrings.HTMLString, 'file://' + TPath.GetDocumentsPath);
That will allow "/images/im2.bmp"
to resolve to something like file:///data/data/<application ID>/files/images/im2.bmp"
, etc.