How can I have a floating image (right aligned) with text that wraps around the image in Android Layout?

Question

It's kind of hard to explain, but an example of what I'm wanting to accomplish is like this:

Here is some text | image |
that is printed   |       |
out in a view and ---------
it is wrapped around an
image that is floating and
right aligned.

I thought about generating the layout in html and using a web view, but I need to be able to perform an action when the user clicks on the image. Does anyone have any ideas?

Thanks in advance,

groomsy

Answer 1

first you must work with some html code, creating a template for your webview...

     String TemplateHTML =

"<div id=\"content\">[Replace with your CONTENT]</div><div id=\"myimage\"><a id=\"mylink\" onClick=\"window.demo.clickOnAndroid()\"><img id=\"myImage\" src=\"[Replace your image URL path]\" /></a></div>"

Create JSInterface to interact with your template

    final class myJavaScriptInterface {
        myJavaScriptInterface () {
        }
        public void clickOnAndroid() {
            mHandler.post(new Runnable() {
                public void run() {
Log.i("myJavaScriptInterface " ,"Jorge is Clickin the image!!! =D");        
                }
            });
        }
    }

add the interface and your Template to your webview!

MyWebView.addJavascriptInterface(new myJavaScriptInterface (), "demo");     
    MyWebView.loadDataWithBaseURL(null, TemplateHTML, "text/html", "utf-8", null);
    WebSettings webSettings = WebContent.getSettings();
    webSettings.setSavePassword(false);
    webSettings.setSaveFormData(false);
    webSettings.setJavaScriptEnabled(true);
    webSettings.setSupportZoom(true);   

Answer 2

you can do it without html ... https://github.com/goingkilo/flowing-text-for-android-/blob/master/screenshot3.png