本文介紹了Android 使用jQuery實現item點擊顯示或隱藏的特效的示例,分享給大家,具體如下:
效果圖

分析
上圖中的功能在很多APP上都可能用到過,例如app的幫助界面,告訴用戶如何使用APP
一般的實現方式都是通過ListView來實現的,實際上此類需求非常簡單,完全可以用WebView加載HTML來實現
抽屜樣式的顯示隱藏特效可以使用jQuery來實現,一個函數就可以搞定
實現
集成jQuery
網頁中需要使用到jQuery,最新版本可以去官網下載
http://jquery.com/download/
不推薦使用超鏈接關聯的方式把jQuery集成到網頁中,如幫助頁面就需要考慮在不聯網的情況下被訪問,所以建議把jQuery放入工程中
這里使用的是發布的精簡版本,直接對鏈接右鍵另存為文本

將另存為的文本重命名為jquery.js,在HTML中通過以下代碼將jQuery集成進來
<script src="jquery.js"></script>
記得要根據集成的路徑修改對應的引入路徑
編寫網頁
實現一個簡單的單條item顯示/隱藏特效
<!doctype html><html><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="initial-scale=1.0, user-scalable=no"/><!-- 網頁樣式 --><style type="text/css"> body, html { width: 100%; height: 100%; margin: 0; font-family: "微軟雅黑"; font-size: 16px; } div.div300 { margin:0px; padding:5px; background:#ffffff; border:solid 1px #c3c3c3; } h3.h300 { margin:0px; padding:5px; background:#F5F5F5; border:solid 1px #c3c3c3; color:black; }</style><!-- 控制邏輯 --><script src="jquery.js"></script><script type="text/javascript">$(document).ready(function(){ $(".h300").click(function(){ $(".div300").slideToggle("fast"); });});</script><title>標題</title></head><body><div style="padding:10px; text-align: justify;"> <h3 class="h300">item點擊顯示或隱藏0</h3> <div class="div300"> <p> 1.上圖中的功能在很多APP上都可能用到過,例如app的幫助界面,告訴用戶如何使用APP。<br><br> 2.一般的實現方式都是通過ListView來實現的,實際上此類需求非常的簡單,完全可以用HTML來實現。<br><br> 3.顯示隱藏的特效可以使用jQuery來實現,一個函數就可以搞定。<br><br> 4.網頁中需要使用到jQuery,最新版本可以去官網下載。<br> </p> </div></div></body></html> 控制邏輯中slideToggle的值可以選擇“slow”或“fast”來改變滑動的速度
body中div300表示要顯示或隱藏的內容,h300表示一個item條目
把寫好的html文件和jquery.js文件一起放入Android工程下的assets中
加載網頁
在Activity中使用WebView加載網頁
加載網頁的代碼
public class GuideActivity extends AppCompatActivity { private final String htmlPath = "file:///android_asset/guide.html"; private WebView mContentWv; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_guide); mContentWv = (WebView) findViewById(R.id.web_guide_content); mContentWv.getSettings().setJavaScriptEnabled(true); mContentWv.loadUrl(htmlPath); }} 使用WebView的要小心各種坑,最需要注意的就是內存泄露問題,目前最好的處理方式,就是給界面中含有WebView的界面開啟一個新的進程,然后在退出該界面的時候結束這個進程
具體做法如下:
在AndroidManifest.xml中給含有WebView的Activity開啟新的進程
<activity android:name=".modules.main.GuideActivity" android:launchMode="singleTask" android:process=":guide.process"/>
通過process屬性指定新進程的名稱,這里設置的是一個私有進程
界面退出時關閉進程
Activity退出時在onDestroy中使用System.exit(0)關閉進程
@Overrideprotected void onDestroy( ViewGroup view = (ViewGroup) getWindow().getDecorView(); view.removeAllViews(); super.onDestroy(); System.exit(0);}
進程退出后,不管它是正常退出的還是異常退出的,操作系統都會去釋放掉這個進程的資源。如內存資源和打開的文件資源等等,這個是由內核控制的,比較靠譜
使用此方法也要注意以下兩點:
總結
簡單的頁面使用HTML來做可以節約開發成本,可移植性強
如果需要動態改變頁面的數據,可以用到WebView與JavaScript互相調用
WebView的使用存在各種坑,開發中需要仔細測試并盡量避免
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持VEVB武林網。
新聞熱點
疑難解答