Before and After Image Slide Comparison on Android

Is it possible to create an image slide comparison control in Android like the one that exists in HTML 5?

http://thenewcode.com/819/A-Before-And-After-Image-Comparison-Slide-Control-in-HTML5

How can I achieve this?

+5
source share
2 answers

I created a library for this function, someone who might need this function will be good for them

compile 'com.github.developer--:beforeafterslider:1.0.4' 
+5
source

One way is to use the search button and a frame that sits on top of the original image. As you extend the guide, the height of the frames is adjusted, which contains the 2nd image.

Top to bottom code

  private SeekBar seekBar; 

under protected void onCreate(Bundle savedInstanceState) {

add

 seekBar = (SeekBar) findViewById(R.id.seekBar1); seekBar.setOnSeekBarChangeListener(new OnSeekBarChangeListener() { int progress = 0; @Override public void onProgressChanged(SeekBar seekBar, int progresValue, boolean fromUser) { FrameLayout target = (FrameLayout) findViewById(R.id.target); progress = progresValue; ViewGroup.LayoutParams lp = target.getLayoutParams(); lp.height = progress; target.setLayoutParams(lp); } @Override public void onStartTrackingTouch(SeekBar seekBar) { } @Override public void onStopTrackingTouch(SeekBar seekBar) { } }); 

layout

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" app:layout_behavior="@string/appbar_scrolling_view_behavior" tools:showIn="@layout/activity_main" tools:context=".MainActivity"> <ImageView android:id="@+id/image" android:layout_width="600dp" android:layout_height="300dp" android:src="@drawable/pug_color"/> <FrameLayout android:id="@+id/target" android:layout_width="600dp" android:layout_height="150dp"> <ImageView android:id="@+id/imageb" android:layout_width="600dp" android:layout_height="300dp" android:layout_gravity="center_horizontal" android:src="@drawable/pug_bw"/> </FrameLayout> <SeekBar android:id="@+id/seekBar1" android:layout_below="@+id/image" android:layout_width="fill_parent" android:layout_height="wrap_content" android:progress="300" android:max="600" /> </RelativeLayout> 
+4
source

Source: https://habr.com/ru/post/1234780/


All Articles