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

微信启动界面

创建项目

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的文章就到这里了,希望大家可以多多关注我们的更多精彩内容!

(0)

相关推荐

  • android 仿微信demo——微信消息界面实现(移动端)

    目录 移动端微信消息页实现 总结 移动端微信消息页实现 在上一篇中主界面实现说过微信四个页面中间都是是fragment的,并且四个fragment的布局都还没实现,所以这一篇主要实现微信消息界面的实现(第一个fragment) 微信消息页是可以上下滑动,每一个列表最多都有可显示五个数据,还可以点击列表 要实现上诉功能只需要在fragment布局中使用ListView,然后给ListView指定一个Item布局即可 修改微信消息界面fragment布局 weixin_fragment.xml <L

  • android 仿微信demo——登录功能实现(移动端)

    移动端登录功能实现 登录功能基本和注册一样,唯一不同的是登录可以实现两种登录方式(微信号和手机号),也就是布局不一样.所以需要两个布局,两个activity(这个方法比较简单粗暴,我懒.也可以通过activity动态切换布局,这样只需要一个activity就可以了) 创建两个activity,实现两种登录方式 微信号登录activity LoginUser.java package com.example.wxchatdemo; import android.annotation.Suppres

  • android 仿微信demo——登录功能实现(服务端)

    上一篇文章实现了微信登录的移动端功能,下面继续完善功能,实现微信登录服务端功能 服务端登录功能实现 在以往文章里已经实现了服务端mvc框架,而登录和注册是类似,所以只需要在web层创建一个Servlet用于和客户端完成数据交互且在service层和dao层中在相应的接口添加相应的抽象方法,然后再实现类中重写就好了. 创建Servlet Login.java,实现服务端和客户端的数据交互 Login.java package com.example.controller; import com.a

  • android 仿微信demo——注册功能实现(服务端)

    服务端注册功能实现 通过web层完成客户端和服务端的数据交互(接受数据,发送数据),service层完成业务逻辑(注册,登录),dao层操作数据库(要借助工具类) 创建项目 idea创建服务端项目 配置tomcat服务器 启动项目测试服务器 创建web层和客户端完成数据交互 创建Servlet Reigister.java Reigister.java package com.example.controller; import com.alibaba.fastjson.JSON; import

  • android 仿微信demo——注册功能实现(移动端)

    移动端注册功能实现 微信的注册界面每一个文本段都有下划线且默认颜色都是灰色,当其中一个文本段获取焦点会将下划线的颜色变为绿色,而且文本输入框的光标也是绿色的,还有在文本输入框没有全部输入的情况下,按钮是不能点击的,只有当文本输入框全部输入的情况下才能点击且此时按钮会变成绿色.除了这些UI功能外,当点击注册按钮是还会把表单数据发送给服务器 创建activity Reigister.java activity Reigister.java package com.example.wxchatdemo

  • android 仿微信demo——微信主界面实现

    以往文章中实现微信启动页,登录注册功能,此基础上继续完善仿微信功能. 主界面实现 (1)整体采用RelativeLayout相对布局 (2)最上面是toolbar操作栏,搜索框SearchView,Overflow(含有4个单选菜单项) (3)中间使用Fragment组件(不使用ViewPager,有兴趣可以自己添加实现下). (4)最下面是水平的LinearLayout线性布局:含有4个自定义的控件 这一篇主要是实现主界面,其他像顶部(toolbar,SearchView,Overflow),

  • Android仿硬币转动微信红包动画效果

    项目需要研究了一下微信红包动画,即硬币转动的效果,原理其实就是三张不同角度的图片利用AnimationDrawable帧动画进行播放,在参考了案例之后,给自己记录一下完成的过程. 1,在XML文件中定义动画: 步骤如下: ①新建 Android 项目 ②在drawable目录中新建一个anim.xml(注意文件名小写) <?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:andr

  • Android开发基础之创建启动界面Splash Screen的方法

    本文实例讲述了Android开发基础之创建启动界面Splash Screen的方法.分享给大家供大家参考.具体如下: 启动界面Splash Screen在应用程序是很常用的,往往在启动界面中显示产品Logo.公司Logo或者开发者信息,如果应用程序启动时间比较长,那么启动界面就是一个很好的东西,可以让用户耐心等待这段枯燥的时间. Android 应用程序创建一个启动界面Splash Screen非常简单.比如创建一个工程MySample,主Acitity就叫MySample,创建另一个Activ

  • Android开发中简单设置启动界面的方法

    本文实例讲述了Android开发中简单设置启动界面的方法.分享给大家供大家参考,具体如下: 启动界面的意义是为了让后台处理耗时的复杂工作,当工作处理完成后,即可进入主界面.相比让用户等待布局加载完成,使用一张图片作为启动背景,会带来更好的体验. 首先,需要建立一个简单的布局: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas

  • android 仿ios数字密码解锁界面的实例

    如下所示: 每个Android开发人员都知道,现在android的解锁最常用的就是九宫格解锁,ios的解锁常用的是数字密码解锁.而我们在开发工程中,很多时候,都需要android和ios进行结合.有的时候我们就需要把我们的解锁界面弄成像ios一样的数字键盘. 这里我就实现了一个仿照ios的数字密码解锁界面.在这里我采用了两种方式来实现,第一种就是使用自定义控件的形式,第二种就是使用我们的布局来实现的.这里我就着重讲一下使用自定义控件形式实现的思路.至于使用布局文件实现的方式,我就不进行具体的讲解

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

    微信启动界面 创建项目 android studio创建移动端项目 微信启动界面实现 当第一次点击微信时会看到微信出现启动界面(不包括两个按钮)停留大概一秒的时间,然后才进入包括两个按钮的启动界面.按钮在没有获取和获取焦点时都有不同的图片显示,所以下面要实现这些功能 创建两个activity其对应的布局,一个activity显示停留的界面(布局就是一张图片),另一个activity显示真正的启动界面(布局包括图片及两个按钮),创建两个selector文件实现按钮在没有获取和获取焦点时显示不同图片

  • android 仿微信demo——微信通讯录界面功能实现(移动端,服务端)

    目录 移动端微信通讯录界面功能实现 服务端微信通讯录界面功能实现 测试 总结 前面我们实现了微信消息界面的实现,这篇继续完善微信功能,实现微信通讯录界面 移动端微信通讯录界面功能实现 微信通讯录,头部是四个标签(不进行分组),下面是好友信息且根据呢称首字母进行排序分组,底部还统计了好友个数,右边是一组英文字母导航,可滑动并且还可以点击跳转到相应的分组 微信好友和顶部的四个标签,可以用ListViw实现并指定一个item布局,分组效果只需要在代码段进行判断即可 右边的字母操作行可以自定义一个组件继

  • android 仿微信demo——微信消息界面实现(服务端)

    目录 服务端微信消息页实现 测试 总结 上一篇实现了移动端微信消息界面功能,以此为基础继续完善服务端功能 服务端微信消息页实现 微信消息界面的实现,和登录,注册是类似的,无非就是接受客户端数据,然后通过这个数据去数据库查找,如果查得到话,返回相应值给客户端. 在移动端中,当用户输入表单后点击登陆,如果登陆成功,则会把微信号通过Itent传给主界面activity,而在微信主界面点击微信消息界面时,会把微信号作为fragment的参数传给微信消息界面,然后通过把微信号数据发送给服务器,服务器接受到

  • Android仿iOS侧滑退出当前界面功能

    我们都知道在ios手机上面,有一个侧滑退出当前界面的功能,但是在安卓手机上系统没有给我们提供这样的功能,但是这依然阻挡不了强大的安卓的定制功能,我们完全可以自己定制一套这样的功能. 首先看下效果图: 分析: (1)要想模仿ios的这种效果,因为我们通过手指的滑动,所以这里肯定跟我们的滑动事件有关系(onInterceptTouchEvent,onTouchEvent这两个方法的关系,如果不清楚,请直接查阅事件传递机制原理) (2)我们要想直接拦截我们的所有触摸事件,我们可以在上层父级布局中进行拦

随机推荐