我已经尝试了一段时间并且有一个可行的解决方案。我不确定这是否是最有效的解决方案,但我继续研究和编写代码,直到找到有意义的东西为止。以下代码中,我需要向Android和Amir在http://android-journey.blogspot.com/2010/01/android-webview.html提供大声喊叫,因为他帮助我弄清楚了这个问题。他有些很棒的东西,你们都应该去看看。
第一步是在您的Activity包中创建一个名为SimpleGestureFilter的类,并使用此处的代码。这直接来自Amir,并且极大地简化了滑动手势交互。
下一步是在您的布局中使用ViewFlipper。我正在使用按钮和其他几个元素,因此在此布局文件中还有更多内容,但您应该能够理解。
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="5dp">
<Button
android:id="@+id/cat_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Categories" />
<Button
android:id="@+id/home_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Home" />
<Button
android:id="@+id/search_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Search" />
</LinearLayout>
<ViewFlipper
android:id="@+id/flipview"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<WebView
android:id="@+id/mainview"
android:layout_height="fill_parent"
android:layout_width="fill_parent" />
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/catview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/searchview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</ViewFlipper>
</LinearLayout>
正如您所看到的,XML描述了一个包含ViewFlipper的线性布局。在视图翻转器中有三个WebViews。
最后一步是Activity...
package example.swipetest;
import example.swipetest.SimpleGestureFilter;
import example.swipetest.SimpleGestureFilter.SimpleGestureListener;
import android.app.Activity;
import android.app.ProgressDialog;
import android.os.AsyncTask;
import android.os.Bundle;
import android.os.Handler;
import android.view.MotionEvent;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.ViewFlipper;
public class SwipeTest extends Activity implements SimpleGestureListener {
private Handler handler = new Handler();
private WebView mainView;
private WebView catView;
private WebView searchView;
private ViewFlipper flipview;
private Button cat_btn;
private Button home_btn;
private Button search_btn;
private ProgressDialog progressDialog;
private Animation slideLeftIn;
private Animation slideLeftOut;
private Animation slideRightIn;
private Animation slideRightOut;
final Activity activity = this;
private SimpleGestureFilter filter;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mainView = (WebView) findViewById(R.id.mainview);
cat_btn = (Button) findViewById(R.id.cat_btn);
home_btn = (Button) findViewById(R.id.home_btn);
search_btn = (Button) findViewById(R.id.search_btn);
mainView = _clientSettings(mainView);
flipview = (ViewFlipper) findViewById(R.id.flipview);
cat_btn.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
_flipView(cat_btn);
}
});
home_btn.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
_flipView(home_btn);
}
});
search_btn.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
_flipView(search_btn);
}
});
slideLeftIn = AnimationUtils.loadAnimation(this, R.anim.slide_in_left);
slideLeftOut = AnimationUtils.loadAnimation(this, R.anim.slide_out_left);
slideRightIn = AnimationUtils.loadAnimation(this, R.anim.slide_in_right);
slideRightOut = AnimationUtils.loadAnimation(this, R.anim.slide_out_right);
this.filter = new SimpleGestureFilter(this, this);
this.filter.setMode(SimpleGestureFilter.MODE_TRANSPARENT);
mainView.loadUrl("file:///android_asset/test1.html");
mainView.setWebViewClient(new BasicWebViewCient());
new ManageViews().execute();
}
private Boolean _flipView(Button button) {
switch (button.getId()) {
case R.id.cat_btn:
_setCategories();
return true;
case R.id.home_btn:
_setHome();
return true;
case R.id.search_btn:
_setSearch();
return true;
default:
return false;
}
}
private WebView _clientSettings(WebView view) {
view.getSettings().setJavaScriptEnabled(true);
view.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
view.addJavascriptInterface(new PanelJSI(), "interface");
return view;
}
private class BasicWebViewCient extends WebViewClient {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return true;
}
@Override
public void onLoadResource(WebView view, String url) {
if (progressDialog == null) {
progressDialog = new ProgressDialog(activity);
progressDialog.setMessage("Locating");
progressDialog.show();
}
}
@Override
public void onPageFinished(WebView view, String url) {
if (progressDialog.isShowing()) {
progressDialog.dismiss();
}
}
}
private class ManageViews extends AsyncTask<Void, Void, Void> {
@Override
protected Void doInBackground(Void... args) {
catView = (WebView) findViewById(R.id.catview);
catView = _clientSettings(catView);
catView.loadUrl("file:///android_asset/test2.html");
catView.setWebViewClient(new BasicWebViewCient());
searchView = (WebView) findViewById(R.id.searchview);
searchView = _clientSettings(searchView);
searchView.loadUrl("file:///android_asset/test3.html");
searchView.setWebViewClient(new BasicWebViewCient());
return null;
}
}
private void _setCategories() {
if (flipview.getDisplayedChild() != 1) {
flipview.setInAnimation(slideLeftIn);
flipview.setOutAnimation(slideRightOut);
flipview.setDisplayedChild(1);
}
}
private void _setHome() {
if (flipview.getDisplayedChild() != 0) {
if (flipview.getDisplayedChild() == 1) {
flipview.setInAnimation(slideRightIn);
flipview.setOutAnimation(slideLeftOut);
} else if (flipview.getDisplayedChild() == 2) {
flipview.setInAnimation(slideLeftIn);
flipview.setOutAnimation(slideRightOut);
}
flipview.setDisplayedChild(0);
}
}
private void _setSearch() {
if (flipview.getDisplayedChild() != 2) {
flipview.setInAnimation(slideRightIn);
flipview.setOutAnimation(slideLeftOut);
flipview.setDisplayedChild(2);
}
}
final class PanelJSI {
public void setView(final String shift) {
handler.post(new Runnable() {
public void run() {
if (shift.equals("categories")) {
_setCategories();
} else if (shift.equals("home")) {
_setHome();
} else {
_setSearch();
}
}
});
}
}
@Override
public boolean dispatchTouchEvent(MotionEvent me) {
this.filter.onTouchEvent(me);
return super.dispatchTouchEvent(me);
}
@Override
public void onSwipe(int direction) {
switch (direction) {
case SimpleGestureFilter.SWIPE_RIGHT:
if (flipview.getDisplayedChild() == 0) {
_setCategories();
} else if (flipview.getDisplayedChild() == 2) {
_setHome();
}
break;
case SimpleGestureFilter.SWIPE_LEFT:
if (flipview.getDisplayedChild() == 1) {
_setHome();
} else if (flipview.getDisplayedChild() == 0) {
_setSearch();
}
break;
case SimpleGestureFilter.SWIPE_DOWN:
case SimpleGestureFilter.SWIPE_UP:
}
}
@Override
public void onDoubleTap() {}
}
所以...我想出的基本模式是使用单个Web客户端和浏览器设置。我使用onCreate方法加载视图,设置第一个视图,然后使用异步方法在主视图加载后加载其他视图。因此,其中两个视图在后台加载。我使用Amir传递的模式来管理滑动。我使用按钮和JS接口在单击时调用相同的动画。
最终结果是针对ViewFlipping Webviews的滑动和点击动画,类似于您将在新Android市场UI中看到的用户界面。随时推荐任何可能使此模式更强大的其他实现。