欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

android做一个效果不一样的记事本?

程序员文章站 2022-03-11 22:58:31
android记事本1.导入依赖包2.layout的使用1.在card.xml使用CardView来设置展示每个页面的内容2.在activity_main.xml调用框架swipestack框架使用滑动功能。3.MainActivity页面1.初始化数据2.点击事件实现左右滑动3.当进行左滑动,或右滑动的响应事件4.当页面为空时5.重新刷新页面6.遍历mData数组里面所有的数据7.如果感觉分开看不是很清晰,可以看总体代码。这个功能效果还是比较好用的,给你带来不一样的体验,废话不多说。首先看效果,效果如下...


这个功能效果还是比较好用的,给你带来不一样的体验,废话不多说。首先看效果,效果如下, 可以不通过按图中的左滑等按钮,也可以使用手动滑动来效果

android做一个效果不一样的记事本?

1.导入依赖包

首先新建一个project或者module。

implementation 'link.fls:swipestack:0.3.0'

如果所示:
android做一个效果不一样的记事本?
如果想了解框架源码的话,可以GitHub框架源地址去了解一下。

因为还有一个其他的功能,需要导入依赖包(例如:CardView,Snackbar等),如下所示:

implementation 'androidx.cardview:cardview:1.0.0'
implementation 'com.google.android.material:material:1.2.1'

如果没有FloatingActionButton的话,可以去手动下载,我这里是下载好了:
android做一个效果不一样的记事本?

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>

效果如图:
android做一个效果不一样的记事本?

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>

效果如图所示:
android做一个效果不一样的记事本?

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等原来存数据。

本文地址:https://blog.csdn.net/qq_45137584/article/details/112811081