如果想了解更多的android小功能,可以看一下我的其他博客博客地址去了解一下。
这个功能效果还是比较好用的,给你带来不一样的体验,废话不多说。首先看效果,效果如下,可以不通过按图中的左滑等按钮,也可以使用手动滑动来效果
:
如果所示:
如果想了解框架源码的话,可以GitHub框架源地址去了解一下。
因为还有一个其他的功能,需要导入依赖包(例如:CardView,Snackbar等),如下所示:
implementation 'androidx.cardview:cardview:1.0.0'
implementation 'com.google.android.material:material:1.2.1'
如果没有FloatingActionButton的话,可以去手动下载,我这里是下载好了:
2.layout的使用
1.在card.xml使用CardView来设置展示每个页面的内容
因为看起来来清晰一点,我只使用了一个TextView。
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:background="#FFFFFF"
card_view:cardCornerRadius="@dimen/card_corner_radius"
card_view:cardElevation="@dimen/elevation_large">
<TextView
android:id="@+id/textViewCard"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="1"
android:background="@drawable/bg"
android:gravity="center"
android:text="@string/dummy_text"
android:textColor="#333"
android:textSize="30sp" />
</androidx.cardview.widget.CardView>
效果如图:
2.在activity_main.xml调用框架swipestack框架使用滑动功能。
<link.fls.swipestack.SwipeStack
android:id="@+id/swipeStack"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/buttonSwipeLeft"
android:padding="@dimen/padding_swipestack"
app:stack_rotation="10"
app:stack_size="3" />
总体界面布局代码如下:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false"
tools:context=".MainActivity">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="@color/colorPrimaryDark"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="记事本"
android:textColor="#FFF"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"></TextView>
</androidx.constraintlayout.widget.ConstraintLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="60dp"
app:layout_constraintTop_toTopOf="parent">
<Button
android:id="@+id/buttonSwipeLeft"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
android:text="@string/swipe_left"
android:textSize="16sp" />
<Button
android:id="@+id/buttonSwipeRight"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:text="@string/swipe_right"
android:textSize="16sp" />
<link.fls.swipestack.SwipeStack
android:id="@+id/swipeStack"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/buttonSwipeLeft"
android:padding="@dimen/padding_swipestack"
app:stack_rotation="10"
app:stack_size="3" />
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fabAdd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:layout_margin="@dimen/margin_fab"
android:src="@drawable/ic_content_add"
app:fabSize="normal" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</RelativeLayout>
<ImageView
android:id="@+id/reflash"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="1dp"
android:onClick="Reflash"
app:layout_constraintBottom_toBottomOf="@+id/constraintLayout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/reflash" />
</androidx.constraintlayout.widget.ConstraintLayout>
效果如图所示:
3.MainActivity页面
1.初始化数据
private void fillWithTestData() {
mData.add("鹰击天风壮,鹏飞海浪春");
mData.add("做好手中事,珍惜眼前人");
mData.add("寒冷到了极致时,太阳就要光临");
mData.add("绝大多数人,在绝大多数时候");
}
2.点击事件实现左右滑动
@Override
public void onClick(View v) {
if (v.equals(mButtonLeft)) {
mSwipeStack.swipeTopViewToLeft(); //左滑动
} else if (v.equals(mButtonRight)) {
mSwipeStack.swipeTopViewToRight(); //右滑动
} else if (v.equals(mFab)) {
EditText(); //添加新数据
}
}
3.当进行左滑动,或右滑动的响应事件
//右滑动响应事件
@Override
public void onViewSwipedToRight(int position) {
String swipedElement = mAdapter.getItem(position);
Toast.makeText(this, getString(R.string.view_swiped_right, swipedElement),
Toast.LENGTH_SHORT).show();
}
//右滑动响应事件
@Override
public void onViewSwipedToLeft(int position) {
String swipedElement = mAdapter.getItem(position);
Toast.makeText(this, getString(R.string.view_swiped_left, swipedElement),
Toast.LENGTH_SHORT).show();
}
4.当页面为空时
@Override
public void onStackEmpty() {
Toast.makeText(this, R.string.stack_empty, Toast.LENGTH_SHORT).show();
}
5.重新刷新页面
public void Reflash(View v){
mSwipeStack.resetStack();
Snackbar.make(mFab, R.string.stack_reset, Snackbar.LENGTH_SHORT).show();
}
6.遍历mData数组里面所有的数据
public class SwipeStackAdapter extends BaseAdapter {
private List<String> mData;
public SwipeStackAdapter(List<String> data) {
this.mData = data;
}
@Override
public int getCount() {
return mData.size();
}
@Override
public String getItem(int position) {
return mData.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(final int position, View convertView, ViewGroup parent) {
if (convertView == null) {
convertView = getLayoutInflater().inflate(R.layout.card, parent, false);
}
final TextView textViewCard = (TextView) convertView.findViewById(R.id.textViewCard);
textViewCard.setText(mData.get(position));
return convertView;
}
}
7.如果感觉分开看不是很清晰,可以看总体代码。
总体代码如下:
package com.example.cardtest1;
import androidx.appcompat.app.AppCompatActivity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;
import com.google.android.material.floatingactionbutton.FloatingActionButton;
import com.google.android.material.snackbar.Snackbar;
import java.util.ArrayList;
import java.util.List;
import link.fls.swipestack.SwipeStack;
public class MainActivity extends AppCompatActivity implements SwipeStack.SwipeStackListener, View.OnClickListener {
private Button mButtonLeft, mButtonRight;
private FloatingActionButton mFab;
private ArrayList<String> mData;
private SwipeStack mSwipeStack;
private SwipeStackAdapter mAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mSwipeStack = (SwipeStack) findViewById(R.id.swipeStack);
mButtonLeft = (Button) findViewById(R.id.buttonSwipeLeft);
mButtonRight = (Button) findViewById(R.id.buttonSwipeRight);
mFab = (FloatingActionButton) findViewById(R.id.fabAdd);
mButtonLeft.setOnClickListener(this);
mButtonRight.setOnClickListener(this);
mFab.setOnClickListener(this);
mData = new ArrayList<>();
mAdapter = new SwipeStackAdapter(mData);
mSwipeStack.setAdapter(mAdapter);
mSwipeStack.setListener(this);
fillWithTestData();
}
//数据初始化
private void fillWithTestData() {
mData.add("鹰击天风壮,鹏飞海浪春");
mData.add("做好手中事,珍惜眼前人");
mData.add("寒冷到了极致时,太阳就要光临");
mData.add("绝大多数人,在绝大多数时候");
}
//添加新的数据
public void EditText(){
final EditText inputServer = new EditText(MainActivity.this);
AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
builder.setTitle("输入笔记").setIcon(R.drawable.book).setView(inputServer)
.setNegativeButton("取消", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
dialog.dismiss();
}
});
builder.setPositiveButton("确定", new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int which) {
String text = inputServer.getText().toString();
mData.add(text.toString());
mAdapter.notifyDataSetChanged();
}
});
builder.show();
}
public void Reflash(View v){
mSwipeStack.resetStack();
Snackbar.make(mFab, R.string.stack_reset, Snackbar.LENGTH_SHORT).show();
}
//选择滑动方法,或者添加新数据
@Override
public void onClick(View v) {
if (v.equals(mButtonLeft)) {
mSwipeStack.swipeTopViewToLeft();
} else if (v.equals(mButtonRight)) {
mSwipeStack.swipeTopViewToRight();
} else if (v.equals(mFab)) {
EditText(); //添加新数据
}
}
@Override
public void onViewSwipedToRight(int position) {
String swipedElement = mAdapter.getItem(position);
Toast.makeText(this, getString(R.string.view_swiped_right, swipedElement),
Toast.LENGTH_SHORT).show();
}
@Override
public void onViewSwipedToLeft(int position) {
String swipedElement = mAdapter.getItem(position);
Toast.makeText(this, getString(R.string.view_swiped_left, swipedElement),
Toast.LENGTH_SHORT).show();
}
//数据为空时
@Override
public void onStackEmpty() {
Toast.makeText(this, R.string.stack_empty, Toast.LENGTH_SHORT).show();
}
//遍历mData里面的数据
public class SwipeStackAdapter extends BaseAdapter {
private List<String> mData;
public SwipeStackAdapter(List<String> data) {
this.mData = data;
}
@Override
public int getCount() {
return mData.size();
}
@Override
public String getItem(int position) {
return mData.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(final int position, View convertView, ViewGroup parent) {
if (convertView == null) {
convertView = getLayoutInflater().inflate(R.layout.card, parent, false);
}
final TextView textViewCard = (TextView) convertView.findViewById(R.id.textViewCard);
textViewCard.setText(mData.get(position));
return convertView;
}
}
}
总体代码如上,如果遇到什么问题可以说出来,一起解决,因为为了展示起来方便一点,我没有把代码存入数据库,自己可以使用本地数据库或者bmob
等原来存数据。