Android-click a thumbnail in the text to bring up a large image.

Source: Internet
Author: User

I haven't written a blog for a long time. I have been busy with an exam project over the past two days, and I will write down some of my experience in implementing the effects, I hope to help anyone who can see it or those who need it.

First, let's look at the basic functions that have not been implemented by the artist.

In fact, I have reviewed a lot of content for this project and integrated some of the functions used in a previous project, for example, 1. Custom title bar 2. Interaction between Java and JavaScript 3. activity implementation similar to dialog style 4. multi-thread implementation countdown 5. Save configuration information when exiting activity (the remaining time of the Examination) 6. Familiar with UI Layout

In the above results, we will talk about how to use Java and JavaScript to adjust each other and click a thumbnail in the text to bring up a large image.

When I first wanted to achieve this, I thought of the textview control, because textview can insert images in the text through the HTML class. But there is a problem that bothers me. The number of images in a text is uncertain. How can I add multiple images to a textview? (this is a good solution. Any image can be spliced through the append method of textview, because the thumbnails here are the same, but this cannot locate the thumbnail that I clicked. The large image should pop up ). Finally, I thought of the webview control, which loads a local HTML page, and passes an imgsrc parameter to the Java method by adding an onclick event to the <image/> object, open an activity in Java to display the image. OK. The whole effect is finished. So easy, although there is not much code to achieve this effect at last, it takes nearly a day to go from the textview control to webview, but this process is very enjoyable, I know more.

The code below is parsed step by step: first, prepare the local HTML file in asset.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<body onload="window.JsUseJave.onLoad()">
Write a recount for your newsletter using the notes given _____
<a onClick='setIv("/sdcard/IMG001.png")' > </a>
<script language="javascript">
function load(src){
document.getElementById('ig').src=src;
}

function setIv(src){
window.JsUseJave.setImgSrc(src)
}
</script>
</body>

1. At the very beginning, I wanted to automatically load images when entering the activity.

wv.loadUrl("javascript:load('"+imgSrc+"'");

But a problem is found that the JS: load (SRC) method is called directly in onload () of the body and is not executed. You cannot attach resources to images by clicking the button. Later, I suddenly thought that JavaScript and Java could be intertuned. I added this step to the javascriptinterface class, which should be defined by myself.

Final class jsusejaveinterface {
Public void setimgsrc (string imgsrc ){
Intent intent = new intent (e6.this, imageshow. Class );
Bundle bundle = new bundle ();
Bundle. putstring ("imgsrc", imgsrc );
Intent. putextras (bundle );
Startactivity (intent );
}

// Log on to load the image
Public void onload (){
WV. loadurl ("javascript: load ('" + SRC + "')");
}
}

Set JavaScript and call Java

        wv.addJavascriptInterface(new JsUseJaveInterface(), "JsUseJave");

In the onload event of the HTML file body, use Java to call the load (SRC) event in the JavaScript method step by step. In this way, the thumbnail will be displayed at the same time when the activity is loaded.

2. With the previous experience, click the thumbnail to bring up a large image. For the <image/> Add Click Event, call a method in Java to re-open an activity to display a large image, that is, the setimgsrc () method in the Custom jsusejavainteface above.

** JS calls the method in Java: window. jsusejave. onload (), jsusejave is WV. addjavascriptinterface (New jsusejaveinterface (), "jsusejave"); the alias in onload () is a method defined in the jsusejaveinterface class.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.