ViewFlipper에서 WebView 를 불러와 슬라이딩 적용하기

flipper를 이용 하여 좌우 슬라이딩 animation 효과 주기 사용법

우선 main.xml 에 viewflipper 안에 슬라이딩 효과를 주고 싶은 TextView 또는 ImageView 같은 View를 넣어준다.

main.xml

<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent">
 
 <ViewFlipper
  android:layout_height="fill_parent"
  android:id="@+id/viewFlipper1"
  android:layout_width="fill_parent"
  android:flipInterval="1000">
  <WebView
         android:id="@+id/sqkweb1"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent"
         android:gravity="center"/>
  <WebView
         android:id="@+id/sqkweb2"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent"
         android:gravity="center"/>
  <WebView
         android:id="@+id/sqkweb3"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent"
         android:gravity="center" />   
   
 </ViewFlipper>
</LinearLayout>

전 포스팅에서 그대로 가져오고 TextView 위치에 webview를 넣었다.  

이제 다른건 그대로 나두고 mainactivity.java만 수정을 해주자

webview인경우 web 자체를 불러오기 때문에 자체적으로 스크롤이 형성되어 있어서 textview 나 imageview 처럼 좌우 슬라이딩 터치가 되지 않는다. 그래서 강제적으로 각 webview에 onTouchListener을 적용 시켜서 작동되도록 하였다.

MainActivity.java

public class MSqkActivity extends Activity implements OnTouchListener {
 private WebView mWebView1;
 WebView mWebView2;
 WebView mWebView3;
 ViewFlipper flipper;
 float xAtDown;
 float xAtUp;
 int count = 0;
 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);
  setLayout();
  
  mWebView1.getSettings().setJavaScriptEnabled(true); 
  mWebView1.loadUrl("http://www.yahoo.co.kr");
  mWebView1.setWebViewClient(new WebViewClientClass());
  
  mWebView2.getSettings().setJavaScriptEnabled(true);
  mWebView2.loadUrl("http://www.naver.com");      
  mWebView2.setWebViewClient(new WebViewClientClass());
  
  
  mWebView3.getSettings().setJavaScriptEnabled(true);
  mWebView3.loadUrl("http://daum.net");        
  mWebView3.setWebViewClient(new WebViewClientClass());
  
  flipper=(ViewFlipper)findViewById(R.id.viewFlipper1);
  flipper.setOnTouchListener(this);
  mWebView1.setOnTouchListener(this);
  mWebView2.setOnTouchListener(this);
  mWebView3.setOnTouchListener(this);
 
  
 }
 private class WebViewClientClass extends WebViewClient {
  @Override       
  public boolean shouldOverrideUrlLoading(WebView view, String url) {
   view.loadUrl(url);            
   return true;        
   }    
  }        

 private void setLayout(){
  mWebView1= (WebView) findViewById(R.id.sqkweb1); 
  mWebView2= (WebView) findViewById(R.id.sqkweb2);
  mWebView3= (WebView) findViewById(R.id.sqkweb3);
  }
 
 
 public boolean onTouch(View v, MotionEvent event) {
  if(v !=mWebView1 &&v !=mWebView2 && v !=mWebView3 && v!=flipper) return false;
  if(event.getAction() == MotionEvent.ACTION_DOWN){
   xAtDown=event.getX();  
  }
  else if(event.getAction() == MotionEvent.ACTION_UP){
   xAtUp = event.getX();
   if(xAtDown > xAtUp){
    flipper.setInAnimation(AnimationUtils.loadAnimation(this, R.animator.left_in));
    flipper.setOutAnimation(AnimationUtils.loadAnimation(this, R.animator.left_out));
    count++;
    if(count < 3)
     flipper.showNext();
    else{
     Toast.makeText(this, "마지막 페이지 입니다.", Toast.LENGTH_SHORT).show();
     count--;
    }
   }
   else if(xAtDown < xAtUp){
    flipper.setInAnimation(AnimationUtils.loadAnimation(this, R.animator.right_in));
    flipper.setOutAnimation(AnimationUtils.loadAnimation(this, R.animator.right_out));
    count--;
    if(count >- 1)
     flipper.showPrevious();
    else{
     Toast.makeText(this, "첫번째 페이지 입니다.", Toast.LENGTH_SHORT).show();
     count++;
   }
  }
 }
  return true;
}
}

파란색 webview 부분 빨간색 강제적으로 터치가 작동 되도록 추가한 부분

이렇게 하면 좌우 슬라이딩은 되나 web 자체적인 스크롤이 동작 되지 않는다.

이분분은  scrollview를 사용 하면 된다.