146
技術社區[雲棲]
模仿網易新聞圖片點擊放大效果
先把效果拿出來看一下，點擊新聞圖片可以彈出一個DIALOG放大原理如下：
服務端需要處理：
1、定義一個新聞瀏覽頁麵，如news_list.php?newsid=1
把新聞瀏覽的內容讀取出來
需要注意的是內容裏的圖片,需要給圖片增加一個事件onClick=\"javascript:contactsAction.setImgSrc('$url')\"
$code = "<img src=\"$turl\" border=\"0\" onClick=\"javascript:contactsAction.setImgSrc('$url')\" style=\"$styleCss\" onload=\"$onload\" $alt>";
客戶端處理
1、bbsinfo_listhtml.xml 新聞內容顯示模版
2、bbsimgshow.xml 新聞圖片點擊放大效果
3、BbsinfoList.java 新聞內容讀取頁麵
4、BbsImageShow.java 圖片放大頁麵
處理過程：
新聞內容頁放置webview控件
當內容顯示出來時，點擊圖片觸發服務端的JS事件，客戶端抓取服務端返回的數據，然後打開圖片放大窗體，進行顯示。再點擊一次就關閉窗體。
1、bbsinfo_listhtml.xml代碼
<WebView
android:
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
2、bbsimgshow.xml代碼
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:andro
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:
android:layout_width="wrap_content" android:layout_height="wrap_content"></ImageView>
</LinearLayout>
3、BbsinfoList.java
package com.wyf.tab;
import java.util.List;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import com.wyf.tab.util.Constant;
import android.app.Activity;
import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnLongClickListener;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebView.HitTestResult;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.Toast;
public class BbsinfoList extends Activity implements OnClickListener {
private WebView wv;
String tid;
private String url;
LinearLayout ld;
private ImageView bt_left;
Intent intent = new Intent();
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.bbsinfo_listhtml);
// 加載動畫
ld = (LinearLayout) findViewById(R.id.loading);
ld.setVisibility(View.VISIBLE);
findview();
//
Thread thread = new Thread(new Runnable() {
public void run() {
Message message = new Message();
message.what = 0;
mHandler.sendMessage(message);
}
});
thread.start();
// 獲取傳過來的參數
Bundle bundle = this.getIntent().getExtras();
tid = bundle.getString("tid");
url = Constant.WEB_DIR + Constant.ThreadInfoUrl_webview + tid;
}
// 處理跳轉到主Activity
private Handler mHandler = new Handler() {
@Override
public void handleMessage(Message msg) {
Log.d(">>>>>Mhandler", "開始handleMessage");
showContent(url);
Log.d(">>>>>Mhandler", "LoadActivity關閉");
if (msg.what == 0) {
ld.setVisibility(View.GONE);
}
}
};
private void findview() {
wv = (WebView) findViewById(R.id.webView1);
wv.setVisibility(WebView.VISIBLE);
WebSettings ws = wv.getSettings();
ws.setUseWideViewPort(true);
ws.setJavaScriptEnabled(true);
wv.addJavascriptInterface(new ContactsPlugin(), "contactsAction");
ws.setSupportZoom(true);
wv.setWebChromeClient(new WebChromeClient() {
public void onProgressChanged(WebView view, int progress) {
setTitle("頁麵加載中，請稍候..." + progress + "%");
setProgress(progress * 100);
ld.setVisibility(View.VISIBLE);
if (progress == 100) {
setTitle(R.string.app_name);
ld.setVisibility(View.GONE);
}
}
});
//
bt_left = (ImageView) findViewById(R.id.btn_left);
bt_left.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
finish();
}
});
}
private void showContent(String url) {
wv.loadUrl(url);
}
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
}
private class ContactsPlugin {
/**
* 撥號
*/
@SuppressWarnings("unused")
public void setImgSrc(String imgSrc) {
//Toast.makeText(BbsinfoList.this, imgSrc + "數據加載完!",
// Toast.LENGTH_LONG).show();
Log.e("imgurl", imgSrc);
Intent intent = new Intent(BbsinfoList.this, BbsImageShow.class);
Bundle bundle = new Bundle();
bundle.putString("imgSrc", imgSrc);
intent.putExtras(bundle);
startActivity(intent);
}
}
}
4、BbsImageShow.java
package com.wyf.tab;
import java.io.IOException;
import java.io.InputStream;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
import android.app.Activity;
import android.content.Intent;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.ImageView;
import android.widget.Toast;
public class BbsImageShow extends Activity{
private ImageView iv;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.bbsimgshow);
findview();
}
/*
* 初始化控件，加載數據
*/
private void findview() {
Intent intent = this.getIntent();
Bundle bundle = intent.getExtras();
String imgSrc = bundle.getString("imgSrc");
//Bitmap bm = BitmapFactory.decodeFile(imgSrc);
Bitmap bm = returnBitMap(imgSrc);
iv = (ImageView) findViewById(R.id.ivbig);
iv.setImageBitmap(bm);
iv.setOnClickListener(new ImageView.OnClickListener() {
public void onClick(View arg0) {
//Toast.makeText(ImageShow.this, "關閉圖片", Toast.LENGTH_SHORT).show();
finish();
}
});
}
//獲取圖片路徑函數
public static Bitmap returnBitMap(String url) {
URL myFileUrl = null;
Bitmap bitmap = null;
try {
myFileUrl = new URL(url);
} catch (MalformedURLException e) {
e.printStackTrace();
}
try {
HttpURLConnection conn = (HttpURLConnection) myFileUrl.openConnection();
conn.setDoInput(true);
conn.connect();
InputStream is = conn.getInputStream();
bitmap = BitmapFactory.decodeStream(is);
is.close();
} catch (IOException e) {
e.printStackTrace();
}
return bitmap;
}
}
最後更新：2017-04-02 17:28:41