iis服务器助手广告广告
返回顶部
首页 > 资讯 > 移动开发 >android 仿微信demo——微信启动界面实现
  • 664
分享到

android 仿微信demo——微信启动界面实现

2024-04-02 19:04:59 664人浏览 薄情痞子
摘要

目录微信启动界面创建项目微信启动界面实现测试总结微信启动界面 创建项目 android studio创建移动端项目 微信启动界面实现 当第一次点击微信时会看到微信出现启动界

微信启动界面

创建项目

android studio创建移动端项目

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

微信启动界面实现

当第一次点击微信时会看到微信出现启动界面(不包括两个按钮)停留大概一秒的时间,然后才进入包括两个按钮的启动界面。按钮在没有获取和获取焦点时都有不同的图片显示,所以下面要实现这些功能

创建两个activity其对应的布局,一个activity显示停留的界面(布局就是一张图片),另一个activity显示真正的启动界面(布局包括图片及两个按钮),创建两个selector文件实现按钮在没有获取和获取焦点时显示不同图片。

创建activity AppStart.java, 实现页面延迟跳转

在这里插入图片描述

在这里插入图片描述

AppStart.java


package com.example.wxchatdemo;
import Android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
public class AppStart extends Activity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.app_start); //设置布局
        //延迟一秒后跳转页面
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                
                Intent intent = new Intent(com.example.wxchatdemo.AppStart.this, com.example.wxchatdemo.Welcome.class);
                startActivity(intent);
                com.example.wxchatdemo.AppStart.this.finish(); //结束当前activity
            }
        }, 1000);
    }
}

上面代码设置布局(一张图片),通过new Handler().postDelayed(new Runnable(){})并重写Runnable()接口的run()抽象方法实现页面延迟后跳转activity(通过Intent),Handler().postDelayed是运行在主线程里的,这个开启的Runnable()接口会在这个Handler所依附线程中运行,而这个Handler是在UI线程中创建的,所以自然地依附在主线程中了,且new Handler().postDelayed(new Runnable())没有重新生成新的 New Thread()

在这里插入图片描述

app_start.xml


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="Http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/welcome" >
</LinearLayout>

上面代码就是把线性布局(覆盖屏幕)的背景换成一张图片,相对简单

创建activity Welcome.java, 实现跳转后的页面

Welcome.java


package com.example.wxchatdemo;
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
public class Welcome extends Activity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.welcome); //设置布局
    }
    //登录按钮点击事件处理方法
    public void welcome_login(View v) {
        Intent intent = new Intent();
        
        intent.setClass(com.example.wxchatdemo.Welcome.this, LoginUser.class);
        startActivity(intent);
        this.finish(); //结束当前activity
    }
    //注册按钮点击事件处理方法
    public void welcome_reGISter(View v) {
        Intent intent = new Intent();
        
        intent.setClass(com.example.wxchatdemo.Welcome.this, com.example.wxchatdemo.Reigister.class);
        startActivity(intent);
        this.finish(); //结束当前activity
    }
}

因为微信启动界面的两个按钮点击会跳转相应界面(登录,注册,后面会实现这个功能),所以上面代码除了设置布局(包含图片及两个按钮),还有两个按钮的点击事件处理方法(页面跳转,通过Itent实现)

创建activity Welcome.java对应的布局文件welcome.xml

welcome.xml


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#eee"
    android:gravity="center"
    android:orientation="vertical">
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <ImageView
            android:id="@+id/photoImageView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@android:color/white"
            android:scaleType="fitXY"
            android:src="@drawable/wx_login_reigister" />
        <Button
            android:id="@+id/main_login_btn"
            android:layout_width="100dp"
            android:layout_height="50dp"
            android:layout_alignLeft="@id/photoImageView"
            android:layout_alignBottom="@id/photoImageView"
            android:layout_marginLeft="20dp"
            android:layout_marginBottom="20dp"
            android:background="@drawable/btn_style_green"
            android:onClick="welcome_login"
            android:text="登录"
            android:textColor="#ffffff"
            android:textSize="18sp" />
        <Button
            android:id="@+id/main_regist_btn"
            android:layout_width="100dp"
            android:layout_height="50dp"
            android:layout_alignRight="@id/photoImageView"
            android:layout_alignBottom="@id/photoImageView"
            android:layout_marginRight="20dp"
            android:layout_marginBottom="20dp"
            android:background="@drawable/btn_style_white"
            android:onClick="welcome_register"
            android:text="注册"
            android:textColor="#00FF00"
            android:textSize="18sp" />
    </RelativeLayout>
</LinearLayout>

上面代码主要内容,就是在线性布局里内嵌一个相对布局且相对布局的宽高都是继承父类(线性布局)的即充满屏幕,而ImageView宽高也是继承父类(相对布局),也是充满屏幕,所以要使按钮在底部且离底部和左右两边有一点的距离,就要通过layout_align(相对布局用的属性,参数为id,即以id的组件为参照物)和layout_margin(页边距,即离边上的距离)实现,然后给两个按钮的背景设置自定义的selector文件,实现按钮在获取和没有获取焦点时显示不同的图片

创建控制welcome.xml布局的两个按钮的两个selector.文件,实现按钮没有获取或获取焦点时的显示不同的图片

在这里插入图片描述

在这里插入图片描述

登录按钮的selector文件

btn_style_green.xml


<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/btn_style_one_pressed" android:state_focused="false" android:state_pressed="true" />
    <item android:drawable="@drawable/btn_style_one_nORMal" android:state_focused="false" />
</selector>

注册按钮的selector文件

btn_style_white.xml


<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/btn_style_two_pressed" android:state_focused="false" android:state_pressed="true" />
    <item android:drawable="@drawable/btn_style_two_normal" android:state_focused="false" />
</selector>

在AndroidMainfest.xml文件中声明创建的activity

在这里插入图片描述

AndroidMainfest.xml


<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.wxchatdemo">
    <application
        android:icon="@drawable/wx_loGo_icon"
        android:label="@string/app_name"
        android:theme="@style/Theme.WxChatDemo">
        <activity android:name=".AppStart">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".Welcome" />
    </application>
</manifest>

在这里插入图片描述

测试

由于登录,注册跳转的activity还没有写,所以运行项目测试前,要把这两个跳转的activity注释掉,然后启动项目测试。

在这里插入图片描述

在这里插入图片描述

总结

这篇关于微信demo的文章就到这里了,希望大家可以多多关注编程网的更多精彩内容!

--结束END--

本文标题: android 仿微信demo——微信启动界面实现

本文链接: https://www.lsjlt.com/news/128362.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • android 仿微信demo——微信启动界面实现
    目录微信启动界面创建项目微信启动界面实现测试总结微信启动界面 创建项目 android studio创建移动端项目 微信启动界面实现 当第一次点击微信时会看到微信出现启动界...
    99+
    2022-11-12
  • android 仿微信demo——微信主界面实现
    目录主界面实现测试总结 以往文章中实现微信启动页,登录注册功能,此基础上继续完善仿微信功能。 主界面实现 (1)整体采用RelativeLayout相对布局 (2)最上面是too...
    99+
    2022-11-12
  • android 仿微信demo——微信消息界面实现(移动端)
    目录移动端微信消息页实现总结移动端微信消息页实现 在上一篇中主界面实现说过微信四个页面中间都是是fragment的,并且四个fragment的布局都还没实现,所以这一篇主要实现微信...
    99+
    2022-11-12
  • android 仿微信demo——微信消息界面实现(服务端)
    目录服务端微信消息页实现测试总结 上一篇实现了移动端微信消息界面功能,以此为基础继续完善服务端功能 服务端微信消息页实现 微信消息界面的实现,和登录,注册是类似的,无非就是接受客...
    99+
    2022-11-12
  • android 仿微信demo——微信通讯录界面功能实现(移动端,服务端)
    目录移动端微信通讯录界面功能实现服务端微信通讯录界面功能实现测试总结 前面我们实现了微信消息界面的实现,这篇继续完善微信功能,实现微信通讯录界面 移动端微信通讯录界面功能实现 微信...
    99+
    2022-11-12
  • Android ListView实现仿微信聊天界面
    本篇内容主要讲解“Android ListView实现仿微信聊天界面”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Android ListView实现仿微信聊天界面”吧!Android List...
    99+
    2023-06-20
  • Android ListView仿微信聊天界面
    Android ListView仿聊天界面效果图的具体代码,供大家参考,具体内容如下 1.首先页面总布局(ListView + LinearLayout(TextView+Butt...
    99+
    2022-11-12
  • android 仿微信demo——注册功能实现(移动端)
    目录移动端注册功能实现测试总结移动端注册功能实现 微信的注册界面每一个文本段都有下划线且默认颜色都是灰色,当其中一个文本段获取焦点会将下划线的颜色变为绿色,而且文本输入框的光标也是绿...
    99+
    2022-11-12
  • android 仿微信demo——登录功能实现(移动端)
    目录移动端登录功能实现测试移动端登录功能实现 登录功能基本和注册一样,唯一不同的是登录可以实现两种登录方式(微信号和手机号),也就是布局不一样。所以需要两个布局,两个activity...
    99+
    2022-11-12
  • 微信小程序怎么实现仿微信聊天界面
    本篇内容介绍了“微信小程序怎么实现仿微信聊天界面”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!仿微信聊天界面,数据来自mock数据,支持聊天...
    99+
    2023-06-26
  • Flutter 仿微信支付界面
    目录带装饰效果的 ContainerRow 行布局和 Column列布局ListView列表组件GridView网格组件代码实现结语: 左侧是微信支付的界面,右侧是开发完成后的效果,...
    99+
    2022-11-12
  • html5如何仿微信界面
    这篇文章将为大家详细讲解有关html5如何仿微信界面,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。前言 效果图1 用到的知识点jQuery WeUI 是WeUI的一个jQ...
    99+
    2022-10-19
  • android 仿微信demo——注册功能实现(服务端)
    目录服务端注册功能实现创建项目创建web层和客户端完成数据交互创建service层处理业务逻辑功能创建dao层操作数据库通过JDBC工具类访问数据库mysql中创建数据库和表测试总结...
    99+
    2022-11-12
  • android 仿微信demo——登录功能实现(服务端)
    目录服务端登录功能实现测试总结 上一篇文章实现了微信登录的移动端功能,下面继续完善功能,实现微信登录服务端功能 服务端登录功能实现 在以往文章里已经实现了服务端mvc框架,而登录和...
    99+
    2022-11-12
  • Android仿微信语音聊天界面设计
    有段时间没有看视频了,昨天晚上抽了点空时间,又看了下鸿洋大神的视频教程,又抽时间写了个学习记录。代码和老师讲的基本一样,网上也有很多相同的博客。我只是在AndroidStudi...
    99+
    2022-06-06
    界面 界面设计 Android
  • Android仿新浪微博启动界面或登陆界面(1)
    本文为大家分享了Android模仿新浪微博启动界面&登陆界面的具体实现代码,供大家参考,具体内容如下 启动界面 主要有两个功能: 1.加载启动动画 2.判断网络,有...
    99+
    2022-06-06
    新浪微博 登陆 界面 启动 新浪 Android
  • Android Studio实现仿微信APP门户界面详解及源码
    目录前言界面分析界面动态实现代码静态界面实现总结前言 你好! 本文章主要介绍如何用Android Studio制作简易的门户界面,主要说明框架的各部分功能与实现过程,结尾处附有源码。...
    99+
    2022-11-12
  • android仿微信聊天界面 语音录制功能
    本例为模仿微信聊天界面UI设计,文字发送以及语言录制UI。 1先看效果图:       第一:chat.xml设计 <?x...
    99+
    2022-06-06
    微信聊天界面 界面 Android
  • Android高仿微信5.2.1主界面及消息提醒
    好久没更新博客了,最近在做公司的项目,这也算是我接触的第一个正式项目。通过项目的检验,发现自己积累了一年的知识还是远远不够,想要提高,好的方法是 :项目+书+视频+博客。最重要...
    99+
    2022-06-06
    仿微信 界面 Android
  • iOS仿微信图片分享界面实现代码
    以下是一个iOS仿微信图片分享界面的实现代码的示例:```swiftimport UIKitclass ViewController: UIViewController, UICollectionViewDelegate, UIColl...
    99+
    2023-08-11
    iOS
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作