简单模拟短信app界面

最新推荐文章于 2024-04-26 09:41:00 发布

jiu_shu_

最新推荐文章于 2024-04-26 09:41:00 发布

阅读量1k

点赞数

分类专栏：移动开发文章标签：移动开发

本文链接：https://blog.csdn.net/weixin_43878652/article/details/110516603

版权

移动开发专栏收录该内容

9 篇文章 0 订阅

订阅专栏

运行结果显示

模拟短信的简单app

1 在主页面中，实现标题栏右边选项菜单的简单功能

在res目录下创建menu文件夹，在该文件夹内自定义选项菜单的界面布局
在这里插入图片描述

设置私有全局函数，重写onCreateOptionsMenu方法

	@Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater menuInflater = new MenuInflater(this);
        menuInflater.inflate(R.menu.options, menu);
        return super.onCreateOptionsMenu(menu);
    }

布局效果如图：
在这里插入图片描述

2 实现长按ListVeiw中的item、进行该item的删除功能（上下文菜单）

在MainActivity.java的onCreate函数里，为listView注册上下文菜单

registerForContextMenu(listView);

在MainActivity.java里，设置私有全局函数，重写onCreateOptionsMenu方法

	@Override
    public void onCreateContextMenu(ContextMenu menu, View v, ContextMenu.ContextMenuInfo menuInfo) {
        super.onCreateContextMenu(menu, v, menuInfo);
        menu.add(1, 1, 1, "删除");

        //获取对应的item的positon
        AdapterView.AdapterContextMenuInfo info = (AdapterView.AdapterContextMenuInfo) menuInfo;
        item_id = info.position;
    }

在MainActivity.java里，设置私有全局函数，实现删除功能

	@Override
    public boolean onContextItemSelected(@NonNull MenuItem item) {
        switch (item.getItemId()){
            case 1:
                infoList.remove(item_id);
                adapter.notifyDataSetChanged();
                senders.remove(item_id);
                sendTimes.remove(item_id);
                details.remove(item_id);
                break;
        }
        return super.onContextItemSelected(item);
    }

3 在主页面中，用ListVeiw、Adapter、数据实现自定义列表的显示

Adapter在这三者中的位置：
在这里插入图片描述

3.1 在MainActivity.java同文件夹下，创建itemIfomation类，用于定义ListView的每个item所需数据的数据结构

package XXX;

public class itemIfomation {
    private String sender;
    private String sendTime;
    private String infoDetails;
    public itemIfomation(String sender, String sendTime, String infoDetails){
        this.sender = sender;
        this.sendTime = sendTime;
        this.infoDetails = infoDetails;
    }
    public String getSender(){
        return sender;
    }
    public String getSendTime(){
        return sendTime;
    }
    public String getInfoDetails(){
        return infoDetails;
    }
}

3.2 在MainActivity.java同文件夹下，创建Adapter的子类itemInfomationAdapter，将数据和界面布局渲染到目标ListView

package XXX;

import android.content.Context;
import android.graphics.Typeface;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.TextView;

import java.util.List;

public class itemInfomationAdapter extends ArrayAdapter<itemIfomation> {
    private int resourceId;
    public itemInfomationAdapter(Context context, int id, List<itemIfomation> objects){
        super(context, id, objects);
        resourceId = id;
    }
    @Override
    public View getView(int position, View convertView, ViewGroup parent){
        itemIfomation itemInfo = getItem(position);
        View view = LayoutInflater.from(getContext()).inflate(resourceId, parent, false);
        TextView infoSender = view.findViewById(R.id.textView5);
        TextView infoSendTime = view.findViewById(R.id.textView6);
        TextView infoDetails = view.findViewById(R.id.textView7);

        infoSender.setText(itemInfo.getSender());
        infoSendTime.setText(itemInfo.getSendTime());
        infoDetails.setText(itemInfo.getInfoDetails());
        return view;
    }
}

3.3 在MainActivity.java中，调用上面两个类，实现ListView的渲染

设置私有全局变量：

	private List<itemIfomation> infoList = new ArrayList<>();
    private List<String> senders = new ArrayList<String>(Arrays.asList("10086", "同学A", "同学B", "同学C"));
    private List<String> sendTimes = new ArrayList<String>(Arrays.asList("下午4:09", "下午8:11", "下午8:11", "下午8:11"));
    private List<String> details = new ArrayList<String>(Arrays.asList("【中国移动】尊敬的客户，月底月初将是套餐费收取与缴纳高峰期，为保证您的通信...", "你这周还有几节课？", "周末去哪里玩？", "Android作业里的列表怎么自定义样式的？"));
    private int item_id;
    private itemInfomationAdapter adapter;

设置私有全局函数：

	private void initItemInfo(){
        for(int i=0;i<senders.size();i++) {
            itemIfomation item = new itemIfomation(senders.get(i), sendTimes.get(i), details.get(i));
            infoList.add(item);
        }
    }

在onCreate函数里，实现ListView的渲染：

		// 进行listView的内容渲染和显示
        initItemInfo();
        adapter = new itemInfomationAdapter(MainActivity.this, R.layout.simple_list_item_1, infoList);
        ListView listView = findViewById(R.id.list_view);
        listView.setAdapter(adapter);

4 设置好主要几个页面的布局

activity_main.xml

<?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="wrap_content"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <ListView
            android:id="@+id/list_view"
            android:layout_marginTop="30dp"
            android:layout_width="370dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:background="#FBE1D8"
            android:elevation="10dp"
            android:divider="@drawable/list_divider"
            android:dividerHeight="1dp"
            android:outlineAmbientShadowColor="#FBE1D8"
            android:outlineSpotShadowColor="#FBE1D8"/>
    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

在这里插入图片描述
可以看到，此时listView控件是没有任何item项填充的（需通过Adapter进行填充）

people.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="60dp">

        <TextView
            android:id="@+id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:fontFamily="@font/arrow_left"
            android:gravity="center"
            android:text="@string/arrow_left"
            android:textColor="#2196F3"
            android:textSize="28dp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/textView8"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:fontFamily="@font/people"
            android:text="@string/people"
            android:textSize="45dp"/>
    </FrameLayout>

    <TextView
        android:id="@+id/textView9"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="同学A"
        android:textSize="20dp"
        android:textStyle="bold" />

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="530dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:id="@+id/textView18"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dp"
                android:layout_marginBottom="8dp"
                android:gravity="center"
                android:text="10月13日 周四 晚上18:00"
                android:textColor="#8C8A8A" />

            <TextView
                android:id="@+id/textView11"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="12dp"
                android:background="@drawable/border_radius"
                android:maxWidth="200dp"
                android:text="你这周还有几节课？" />

        </LinearLayout>
    </ScrollView>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="61dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView15"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:fontFamily="@font/camera"
            android:textSize="40dp"
            android:text="@string/camera" />

        <EditText
            android:layout_height="match_parent"
            android:layout_width="0dp"
            android:layout_weight="6"
            android:hint="Input your message here"></EditText>

        <TextView
            android:id="@+id/textView17"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:fontFamily="@font/arrow_top"
            android:text="@string/arrow_top"
            android:textSize="40dp"
            android:textColor="#68FA00"/>
    </LinearLayout>
</LinearLayout>

在这里插入图片描述
界面中，发送方名称、发送时间、发送内容，可以通过java代码进行修改的

yidong.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="60dp">

        <TextView
            android:id="@+id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:fontFamily="@font/arrow_left"
            android:gravity="center"
            android:text="@string/arrow_left"
            android:textColor="#2196F3"
            android:textSize="28dp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/textView8"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:fontFamily="@font/people"
            android:text="@string/people"
            android:textSize="45dp"/>
    </FrameLayout>

    <TextView
        android:id="@+id/textView9"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="10086"
        android:textSize="20dp"
        android:textStyle="bold" />

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="530dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:id="@+id/textView18"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dp"
                android:layout_marginBottom="8dp"
                android:gravity="center"
                android:text="10月13日 周四 晚上18:00"
                android:textColor="#8C8A8A" />

            <TextView
                android:id="@+id/textView11"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="12dp"
                android:background="@drawable/border_radius"
                android:maxWidth="200dp"
                android:text="【中国移动】流量提醒：尊敬的客户，您好！您本月套餐已使用1GB，剩余12GB。" />

            <TextView
                android:id="@+id/textView12"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="20dp"
                android:layout_marginBottom="8dp"
                android:gravity="center"
                android:text="10月14日 周四 晚上18:00"
                android:textColor="#8C8A8A" />

            <TextView
                android:id="@+id/textView13"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:layout_marginRight="12dp"
                android:background="@drawable/border_radius_green"
                android:maxWidth="200dp"
                android:text="113"
                android:textColor="#ffffff"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/textView14"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="12dp"
                android:background="@drawable/border_radius"
                android:maxWidth="200dp"
                android:text="【中国移动】套餐使用情况：尊敬的客户，您好！您本月套餐实时消费情况如下：\n套餐流量已使用2GB，剩余11GB。" />
        </LinearLayout>
    </ScrollView>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="61dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView15"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:fontFamily="@font/camera"
            android:textSize="40dp"
            android:text="@string/camera" />

        <EditText
            android:layout_height="match_parent"
            android:layout_width="0dp"
            android:layout_weight="6"
            android:hint="Input your message here"></EditText>

        <TextView
            android:id="@+id/textView17"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:fontFamily="@font/arrow_top"
            android:text="@string/arrow_top"
            android:textSize="40dp"
            android:textColor="#68FA00"/>
    </LinearLayout>
</LinearLayout>

在这里插入图片描述
这个界面其实跟people.xml是差不多的，由于我水平不是很够，暂时还未实现两个界面合二为一

simple_list_item_1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    android:orientation="horizontal"
    >
    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:textSize="50dp"
        android:text="@string/people"
        android:fontFamily="@font/people"
        android:textColor="#000000"
        android:layout_weight="1"
        android:gravity="center"
        android:padding="10dp"/>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1000"
        android:gravity="center"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="13dp"
        android:layout_marginTop="7dp"
        android:layout_marginBottom="1dp">

        <TextView
            android:id="@+id/textView5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="10086"
            android:textSize="20dp"
            android:textStyle="bold"/>

        <TextView
            android:id="@+id/textView6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_marginTop="8dp"
            android:text="下午4：09"
            android:textColor="#757373"/>

        <TextView
            android:id="@+id/textView7"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:ellipsize="end"
            android:maxLines="2"
            android:lineSpacingMultiplier="1.3"
            android:textSize="13dp"
            android:layout_below="@id/textView6"
            android:layout_alignParentLeft="true"
            android:textColor="#757373"
            android:text="【中国移动】尊敬的客户，月底月初将是套餐费收取与缴纳高峰期，为保证您的通信..." />
    </RelativeLayout>
</LinearLayout>

在这里插入图片描述
这就是listView每个子项的布局

5 实现单击ListVeiw中的item、进行页面跳转的功能

		// 实现listView的单击事件
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener(){
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                Intent intent = new Intent();
                if (position != 0){
                    Bundle bundle = new Bundle();
                    bundle.putString("sender", infoList.get(position).getSender());
                    bundle.putString("info", infoList.get(position).getInfoDetails());
                    intent.putExtras(bundle);
                    intent.setClass(MainActivity.this, MainActivityPeople.class);
                }else{
                    intent.setClass(MainActivity.this, MainActivityYiDong.class);
                }
                startActivity(intent);
            }
        });

6 其他实现细节

后续更新…

jiu_shu_

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
简单模拟短信app界面

1 在主页面中，实现标题栏右边选项菜单的简单功能2 在主页面中，用ListVeiw、Adapter、数据实现自定义列表的显示Adapter在这三者中的位置：2.1 在MainActivity.java同文件夹下，创建itemIfomation类，用于定义ListView的每个item所需数据的数据结构2.2 在MainActivity.java同文件夹下，创建Adapter的子类itemInfomationAdapter，将数据和界面布局渲染到目标ListView2.3 在MainActivit
复制链接

扫一扫