How to use swipe left gesture to read a full news article in Inshorts news app | Inshorts News App Clone PART 3 | Android Studio | Firebase

In this series of tutorials, we are going to create a clone app of Inshorts News App using Firebase Realtime Database. Before starting make sure you are ready with the vertical viewPager and Firebase Database connection, if not then see the PART 1 and PART 2 of the Inshorts News App Clone.

Today, In this tutorial we are going to see how to use the swipe left gesture to read a full news article in Inshort news app.

Overview

Part 1: add a page change listener

int newposition;float x1,x2;
  • After then add page change listener in where we set our data in the adapter class

public class ViewPagerAdapter extends PagerAdapter {
……………..
int newposition;
float x1,x2;
public ViewPagerAdapter(Context context, List<SliderItems> sliderItems, ArrayList<String> titles, ArrayList<String> desc, ArrayList<String> newslinks, ArrayList<String> heads, VerticalViewPager verticalViewPager) {
………………
}

@Override
public int getCount() {
return sliderItems.size();
}

@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
return view == ((LinearLayout) object);
}

@NonNull
@SuppressLint(“ClickableViewAccessibility”)
@Override
public Object instantiateItem(@NonNull ViewGroup container, int position) {
View itemView = mLayoutInflater.inflate(R.layout.
item_container, container, false);
…………………..

verticalViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

}

@Override
public void onPageSelected(int position) {
//save position value in newposition variable on page change
newposition = position;
}

@Override
public void onPageScrollStateChanged(int state) {

}
});

container.addView(itemView);
return itemView;
}

@Override
public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
container.removeView((LinearLayout) object);
}
}

  • then set on touch listener in the vertical ViewPager
  • here we will set the touch to the left i.e. when we swipe left a new activity will open, where we set our newsLink.

public class ViewPagerAdapter extends PagerAdapter {
……

int newposition;

float x1,x2;

public ViewPagerAdapter(Context context, List<SliderItems> sliderItems, ArrayList<String> titles, ArrayList<String> desc, ArrayList<String> newslinks, ArrayList<String> heads, VerticalViewPager verticalViewPager) {

………….

}

@Override

public int getCount() {

return sliderItems.size();

}

@Override

public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {

return view == ((LinearLayout) object);

}

@NonNull

@SuppressLint("ClickableViewAccessibility")

@Override

public Object instantiateItem(@NonNull ViewGroup container, int position) {

View itemView = mLayoutInflater.inflate(R.layout.item_container, container, false);

………………..

verticalViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {

…………..

});

verticalViewPager.setOnTouchListener(new View.OnTouchListener() {

@Override

public boolean onTouch(View view, MotionEvent motionEvent) {

switch (motionEvent.getAction()){

case MotionEvent.ACTION_DOWN:

x1 = motionEvent.getX();

break;

case MotionEvent.ACTION_UP:

x2 = motionEvent.getX();

float deltaX = x1-x2;

if (deltaX > 300){

Intent i = new Intent(context, NewsDetailActivty.class);

if (position == 1){

//for first page

i.putExtra("url", newslinks.get(0));

context.startActivity(i);

}

else {

//when page scrolled

i.putExtra("url", newslinks.get(newposition));

context.startActivity(i);

}

}

break;

}

return false;

}

});

container.addView(itemView);

return itemView;

}

@Override

public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {

container.removeView((LinearLayout) object);

}

}

Part 2: Details Activity

  • Create a WebView in the new XML file
<WebView    android:layout_width="match_parent"    android:layout_height="match_parent"    android:id="@+id/webview"/>
  • And, In the new java file gets the data from intent and shows it in the webView.

public class NewsDetailActivty extends AppCompatActivity {
String newslink;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.
activity_news_detail_activty);

// get data from intent
Intent i = getIntent();
newslink = i.getStringExtra(“url”);

WebView view = (WebView) findViewById(R.id.
webview);
view.setWebViewClient(new WebViewClient(){
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return false;
}
});
view.getSettings().setJavaScriptEnabled(true);
view.loadUrl(newslink);
}
}

Part 3: Give Permissions

<?xml version=”1.0" encoding=”utf-8"?>
<manifest xmlns:android=”http://schemas.android.com/apk/res/android"
package=”com.codewithgolap.inshorts”>

<uses-permission android:name=”android.permission.INTERNET” />
<uses-permission android:name=”android.permission.ACCESS_NETWORK_STATE” />

<application
android:allowBackup=”true”
android:icon=”@mipmap/ic_launcher”
android:label=”@string/app_name”
android:roundIcon=”@mipmap/ic_launcher_round”
android:supportsRtl=”true”
android:theme=”@style/AppTheme”>
<activity android:name=”.SplashActivity”>
<intent-filter>
<action android:name=”android.intent.action.MAIN” />

<category android:name=”android.intent.category.LAUNCHER” />
</intent-filter>
</activity>
<activity android:name=”.NewsDetailActivty” />
<activity android:name=”.MainActivity”>
</activity>

<meta-data
android:name=”preloaded_fonts”
android:resource=”@array/preloaded_fonts” />
</application>

</manifest>

Hi everyone, myself Golap an Android app developer with UI/UX designer.