android realizes the interface layout of sliding up down left and right
- 2021-11-14 07:07:45
- OfStack
In this paper, we share the specific code of android to realize sliding interface layout for your reference. The specific contents are as follows
1. I use ScrollView nested HorizontalScrollView to let ScrollView slide up and down HorizontalScrollView slide left and right
2. The following code provides ideas and means of completion, please modify according to the specific business, I tried to use recyclerview to customize, found that 1 once there is a complex business will drop frame stuck, so this method is used
XML Layout
<?xml version="1.0" encoding="utf-8"?>
<test.smartonet.com.myapplication.PagerScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<HorizontalScrollView
android:id="@+id/hor"
android:layout_width="match_parent"
android:background="#e1f1f1"
android:layout_height="160dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center|left"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/>
</LinearLayout>
</HorizontalScrollView>
<HorizontalScrollView
android:id="@+id/hor1"
android:layout_width="match_parent"
android:scrollbars="none"
android:background="#a2f2f2"
android:layout_height="160dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center|left"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/>
</LinearLayout>
</HorizontalScrollView>
<HorizontalScrollView
android:id="@+id/hor2"
android:layout_width="match_parent"
android:scrollbars="none"
android:background="#a2a2f2"
android:layout_height="160dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center|left"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/>
</LinearLayout>
</HorizontalScrollView>
<HorizontalScrollView
android:id="@+id/hor3"
android:layout_width="match_parent"
android:scrollbars="none"
android:background="#f3f3f3"
android:layout_height="160dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center|left"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/>
</LinearLayout>
</HorizontalScrollView>
<HorizontalScrollView
android:id="@+id/hor4"
android:layout_width="match_parent"
android:scrollbars="none"
android:background="#a4f4f4"
android:layout_height="200dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center|left"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/>
</LinearLayout>
</HorizontalScrollView>
<HorizontalScrollView
android:id="@+id/hor5"
android:layout_width="match_parent"
android:scrollbars="none"
android:background="#f5f5f5"
android:layout_height="200dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center|left"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/>
</LinearLayout>
</HorizontalScrollView>
<HorizontalScrollView
android:id="@+id/hor6"
android:layout_width="match_parent"
android:scrollbars="none"
android:background="#a5f5f5"
android:layout_height="200dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center|left"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A1"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A2"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A3"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A4"/> <TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A5"/><TextView
android:layout_width="160dp"
android:layout_height="60dp"
android:gravity="center"
android:text="A6"/>
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
</test.smartonet.com.myapplication.PagerScrollView>
Code for mainAvtivity
package test.smartonet.com.myapplication;
import android.annotation.SuppressLint;
import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.ScrollView;
import android.widget.TextView;
import android.widget.Toast;
import org.w3c.dom.Text;
import java.lang.reflect.Array;
import java.util.ArrayList;
import java.util.List;
/**
* zhaohan creat 2019/3/6
*/
public class MainActivity extends AppCompatActivity {
String TAG = " Main program ";
float mPosX;
float mPosY;
float mCurPosX;
float mCurPosY;
int offset=10;// Offset
int friction = 10;// Friction force
final List<HorizontalScrollView> list = new ArrayList();
@SuppressLint("ClickableViewAccessibility")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final PagerScrollView scrollView = findViewById(R.id.main);
list.add((HorizontalScrollView) findViewById(R.id.hor));
list.add((HorizontalScrollView) findViewById(R.id.hor1));
list.add((HorizontalScrollView) findViewById(R.id.hor2));
list.add((HorizontalScrollView) findViewById(R.id.hor3));
list.add((HorizontalScrollView) findViewById(R.id.hor4));
list.add((HorizontalScrollView) findViewById(R.id.hor5));
list.add((HorizontalScrollView) findViewById(R.id.hor6));
for(HorizontalScrollView horizontalScrollView:list){
horizontalScrollView.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
mPosX = event.getX();
mPosY = event.getY();
Log.w(TAG,mPosY+"");
break;
case MotionEvent.ACTION_MOVE:
mCurPosX = event.getX();
mCurPosY = event.getY();
case MotionEvent.ACTION_UP:
if (mCurPosX - mPosX > 0 && (Math.abs(mCurPosX - mPosX) > offset)) {
int speed = 10;// Speed
int distance = 20;// Sliding distance
if((Math.abs(mCurPosX - mPosX))>50){
speed = (int) Math.abs(mCurPosX - mPosX)/friction;
distance = (int) Math.abs(mCurPosX - mPosX)/3;// Sliding distance
}
// Slide to the right
Log.w(TAG," Sliding to the right! ");
while(distance>0) {
distance = distance - speed;
for(HorizontalScrollView horizontalScrollView:list){
horizontalScrollView.smoothScrollBy(distance, 0);
}
}
return true;//true For other sliding monitoring within the shielded range
} else if (mCurPosX - mPosX < 0 && (Math.abs(mCurPosX - mPosX) > offset)) {
int speed = 10;// Speed
int distance = 20;// Sliding distance
if((Math.abs(mCurPosX - mPosX))>50){
speed = (int) Math.abs(mCurPosX - mPosX)/friction;
distance = (int) Math.abs(mCurPosX - mPosX)/3;// Sliding distance
}
// Slide to the left
Log.w(TAG," Sliding to the left! ");
// Change to sliding
while(distance>0){
distance=distance-speed;
for(HorizontalScrollView horizontalScrollView:list){
horizontalScrollView.smoothScrollBy(-distance,0 );
}
}
return true;//true For other sliding monitoring within the shielded range
}
break;
}
return true;//true For other sliding monitoring within the shielded range
}
});
}
}
}
class PagerScrollView extends ScrollView {
private float xDistance, yDistance, xLast, yLast;
public PagerScrollView(Context context) {
super(context);
}
public PagerScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public PagerScrollView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
xDistance = yDistance = 0f;
xLast = ev.getX();
yLast = ev.getY();
break;
case MotionEvent.ACTION_MOVE:
final float curX = ev.getX();
final float curY = ev.getY();
xDistance += Math.abs(curX - xLast);
yDistance += Math.abs(curY - yLast);
xLast = curX;
yLast = curY;
/**
* X Axis sliding distance is greater than Y Axis sliding distance, that is, when the user slides horizontally, it returns false , ScrollView If you don't deal with this incident,
* Make the in the child control TouchEvent To deal with, so the event of lateral sliding is handed over to ViewPager Handle,
* ScrollView Handle only vertical sliding events
*/
if (xDistance > yDistance) {
return false;
}
}
return super.onInterceptTouchEvent(ev);
}
}