android仿qq说说上传图片demo
来源:右脑开发 发布时间:2013-04-16 点击:
android仿qq说说上传图片demo篇一
仿QQ聊天系统毕业论文-
基于Android平台的聊天系统设计与实现
摘要
本课题主要研究基于Android的移动聊天系统,以更好的用户体验性为目的开发出界面简洁,用户易操作的移动即时通信聊天工具。该聊天工具的主要功能:用户注册,登录,好友一对一聊天,群组聊天。在该即时通信工具中的数据传输是通过Socket编程实现。客户端之间通过服务器对数据的转发实现相互通信。
本文首先概述了IM聊天工具的背景,其次是课题的目的及意义,然后介绍了软件开发的环境和开发工具及其技术,给出了软件的系统架构,各个模块的流程图及用例,然后详细介绍了改即时通信的工具的设计与实现,最后对系统进行简单的测试。
关键词:Android,即时通信,多线程,注册,登录,聊天
Abstract
The main research topics of the graduation Android-based mobile chat system,
according to its architecture and design principles developed interface is simple and easy to operate mobile instant messaging chat tools. The main function of the chat
tool: user registration, login, friends one-on-one chat, group chat. Data transmission in the real-time communication tools Socket Programming. Communicate with each other on the data forwarding between the client through the server.
The paper first outlines the background of the IM chat tool, followed by the purpose and significance of the issues, and then describes the software development
environment and the development of tools and technology, the software system
architecture, the flow chart of each module and use cases, and then detailed change instant messaging tool design and implementation, and finally a simple test system.
Keywords: Android, instant messaging, multi-threaded, socket, client / server
目录
第一章 绪论................................................................................................................ 1
1.1 聊天软件背景................................................................................................ 1
1.2 课题目的及意义............................................................................................ 2
1.4 设计思想........................................................................................................ 4
1.5 工作方法........................................................................................................ 4
第二章 Android聊天系统需求分析......................................................................... 5
2.1任务概述......................................................................................................... 5
2.1.1 目标.................................................................................................... 5
2.1.2 用户特点............................................................................................ 5
2.1.3 定义.................................................................................................... 5
2.1.4假定与约束......................................................................................... 6
2.2 需求规定........................................................................................................ 6
2.2.1 系统功能需求 ............................................................................................. 6
2.2.2用户注册............................................................................................. 9
2.2.3 用户登录.......................................................................................... 11
2.2.4 用户主面板...................................................................................... 12
2.2.5用户聊天........................................................................................... 13
2.2.6 好友上下线提示.............................................................................. 15
2.2.7增加好友........................................................................................... 15
2.3对性能的规定 ............................................................................................... 15
2.3.1精度................................................................................................... 15
2.3.2时间特性要求................................................................................... 16
2.3.3灵活性............................................................................................... 16
2.4输人输出要求:............................................................................................. 16
2.5数据管理能力要求....................................................................................... 16
2.6其他专门要求............................................................................................... 16
2.7运行环境规定............................................................................................... 16
2.8支持软件....................................................................................................... 17
第三章 基于Android平台的聊天系统设计............................................................ 18
3.1 定义............................................................................................................ 18
3.1.1专业术语........................................................................................... 18
3.2 总体设计...................................................................................................... 18
3.2.1运行环境........................................................................................... 18
3.3基本设计概念和处理流程........................................................................... 19
3.3.1 系统逻辑构架图(图3.1)........................................................... 19
3.3.2系统物理架构图 (图3.2).......................................................... 20
3.3.4顶层系统包图(图3.3)................................................................ 20
3.3.5 具体处理流程.................................................................................. 21
3.4子系统设计................................................................................................... 24
3.4.1用户信息:....................................................................................... 24
3.4.1.2功能概要:................................................................................... 24
3.4.2用户登录........................................................................................... 26
3.4.3 聊天管理.......................................................................................... 28
3.5接口设计....................................................................................................... 31
3.5.1 用户接口.......................................................................................... 31
3.5.2 外部接口.......................................................................................... 31
3.5.3内部接口........................................................................................... 32
3.6运行设计....................................................................................................... 32
3.6.1运行模块组合................................................................................... 32
3.6.2运行控制........................................................................................... 32
3.6.3运行时间........................................................................................... 32
3.7系统数据结构设计....................................................................................... 33
3.7.1逻辑结构设计................................................................................... 33
3.7.2物理结构设计(图3.14).............................................................. 34
3.7.3数据结构与程序的关系(图3.15).............................................. 35
3.8.系统出错处理.............................................................................................. 35
3.8.1出错信息........................................................................................... 35
3.8.2补救措施................................................................................................... 37
第四章 基于Android平台的聊天系统实现............................................................ 38
4.1 服务端模块.................................................................................................. 38
4.2 客户端模块.................................................................................................. 40
4.2.1 客户端启动界面.............................................................................. 40
4.2.2 登录模块.......................................................................................... 42
4.2.3 注册界面.......................................................................................... 47
4.2.4 登录成功.......................................................................................... 50
第五章 基于Android平台的聊天系统系统测试.................................................. 57
“结论”...................................................................................................................... 59
“致谢”...................................................................................................................... 60
参考文献...................................................................................................................... 61
android仿qq说说上传图片demo篇二
Android插件化的思考——仿QQ一键换肤,思考比实现更重要!
Android插件化的思考——仿QQ一键
换肤,思考比实现更重要!
关于QQ的换肤,他们的实现思路我不是很清楚,但是你可以看一下这张换肤的截图
我们想使用哪个主题就直接下载就好了,这一实现的过程我们大致的可以猜想:
首选是下载到本地指定文件夹,然后通过插件加载到我们的apk,最后应用为皮肤,逻辑大致是这样的逻辑了,那我们是不是应该动动手啊动动脑?
首选我们新建一个工程好了——
PlugInSample
一.实现思路
其实说起来,这个插件的实现思路,确实是比较的麻烦,思来想去,还是一种办法比较靠谱,首先,我们刻意去获取手机上所有的安装的/未安装的程序,过滤掉没用的,留下我们的插件apk,我们的插件apk怎么去辨别呢?我们可用通过设置sharedUserId,然后用实体类把插件名称和包名保存下来,有了包名,就比较好说了,我们可用获取插件的上下文,也就是createPackageContext,然后就可以做点坏事了,我们可以去剖析我们的R文件
因为R文件里面都是静态的原因,我们很容易联想到反射机制,是的,我们可以再一次过
滤掉无用的信息,通过我们的PathClassLoader去加载,访问我们的内加载器反射到我们的图片ID,也就是后面的那段数字,然后,嘿嘿,就可以使用了,是不是思路比较清晰了?这里要注意的就是图片命名统一,这样就比较号过来,那具体我们应该怎么做?
二.PlugIn主程序
我们写一个Spinner,每次切换就直接换肤怎么样?OK,每次换的时候就从插件APK里加载我们的图片资源,看起来是比较顺畅的逻辑,那我们具体该怎么做呢?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:id="@+id/mLinearLayout"
xmlns:android="
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<Spinner
android:id="@+id/mSpinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
1.初始化
/**
* 初始化View
*/
private void initView() {
//初始化控件
mSpinner = (Spinner) findViewById(R.id.mSpinner);
}
当然,我这刚应用就一个View,但是实际开发当中可不止,所以步骤一定要明了
2.获取所有的插件
/**{android仿qq说说上传图片demo}.
* 获取手机里的插件
*
* @return
*/
private List<PlugInBean> findPlugIn() {
mList = new ArrayList<>();
//获取相关信息
PackageManager mPackageManager = getPackageManager();
//获取卸载/未安装的安装包信息
List<PackageInfo> mUninstallPackage = mPackageManager.getInstalledPackages(PackageManager.GET_UNINSTALLED_PACKAGES); //遍历拿到我们的信息
for (PackageInfo info : mUninstallPackage) {
String pkgNmae = info.packageName;
//获取shareId,根据id判断是否是我们的ID
String shareUserId = info.sharedUserId;
if (!TextUtils.isEmpty(shareUserId)) {
//如果id相同
if (shareUserId.equals("com.liuguilin.share")) {
//且排除自己的包名
if (!pkgNmae.equals(getPackageName())) {
//这个就是我们的插件了
String lable = mPackageManager.getApplicationLabel(info.applicationInfo).toString();
PlugInBean bean = new PlugInBean();
bean.setLabelNmae(lable);
bean.setPackagNmae(pkgNmae);
mList.add(bean);
}
}
}
}
return mList;
}
这里就是过滤了一下,通过sharedUserId去拿到我们的插件APK了,然后就可以拿到我们的包名和应用名,他返回给我们一个数据集
//所有的插件
List<PlugInBean> allPlugIn = findPlugIn();
3.加载皮肤数据
/**
* 加载皮肤
*
* @param allPlugIn
*/
private void LoadSkin(List<PlugInBean> allPlugIn) {
//遍历
for (PlugInBean bean : allPlugIn) {
HashMap<String, Object> mMap = new HashMap<>();
mMap.put("lable", bean.getLabelNmae());
mMap.put("package", bean.getPackagNmae());
mData.add(mMap);
}
//建立Adapter并且绑定数据源
mAdapter = new SimpleAdapter(this, mData, android.R.layout.simple_list_item_1, new String[]{"lable"}, new int[]{android.R.id.text1});
//设置数据
mSpinner.setAdapter(mAdapter);
//设置监听事件
mSpinner.setOnItemSelectedListener(this);
}
我们通过刚才的数据集便可以把我们拿到的数据给直接显示出来了,这里其实可以判断一下size是否为0,如果为0的话也就没有插件,OK,我们设置adapter和监听,做到这里,其实你可以运行一下,虽然我们现在什么都没有,我们要做的还有很多
4.获取插件Context
/**
* 选中监听事件
*
* @param adapterView
* @param view
* @param i
* @param l
*/
@Override
public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) { PlugInBean bean = mList.get(i);
//插件的包名
String packageNmae = bean.getPackagNmae();
Context mContext = null;
try {
//无视警告 访问代码
mContext = createPackageContext(packageNmae, CONTEXT_IGNORE_SECURITY | CONTEXT_INCLUDE_CODE);
} catch (PackageManager.NameNotFoundException e) {
e.printStackTrace();
}
//获取图片
getImg(packageNmae, mContext);
//通过ID加载插件的图片
getWindow().setBackgroundDrawable(mContext.getResources().getDrawable(mListId.get(i))); }
@Override
public void onNothingSelected(AdapterView<?> adapterView) {
}
这里的代码就比较有意思,一定要仔细看,我们首先拿到选中的item的包名,通过我们的createPackageContext拿到我们的上下文,通过这两个我们可用拿到我们的资源ID,也就是R清单里面的ID,然后直接设置window的背景,这里为了好看才设置window的背景,实际上你要设置的是你根布局的背景,那好,我们来看一下如何通过插件的上下文和包名拿到R清单的资源ID
5.获取插件图片 / 返回图片R文件ID / 反射R文件
/**
* 获取插件图片 / 返回图片R文件ID / 反射R文件
*
* @param packageNmae
* @param mContext
*/
private void getImg(String packageNmae, Context mContext) {
//类加载器反射插件
PathClassLoader pathClass = new PathClassLoader(mContext.getPackageResourcePath(), ClassLoader.getSystemClassLoader()); //反射 $ 访问类加载器
try {
Class<?> forNmae = Class.forName(packageNmae + ".R$drawable", true, pathClass);
//拿到所有图片的id
Field[] files = forNmae.getDeclaredFields();
for (Field id : files) {
//过滤 / 这里的命名可以注意一下
if (id.getName().startsWith("img")) {
int drawId = 0;
////这就是我们图片R下的ID
drawId = id.getInt(R.drawable.class);
mListId.add(drawId);
}
}
} catch (ClassNotFoundException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
android仿qq说说上传图片demo篇三
JS 仿腾讯发表微博的效果代码
JS 仿腾讯发表微博的效果代码
这篇文章主要介绍了JS 仿腾讯发表微博的效果代码,有需要的朋友参考一下
最近2天研究了下 腾讯发表微博的效果 特此来分享下,效果如下:
在此分享前 来谈谈本人编写代码的习惯,很多人会问我既然用的是jquery框架 为什么写的组件不用Jquery那种形式?我当时回答的是:每个人编写代码有每个人的习惯。但是我更想表达的是:这种编码个人觉得 有一个很大的优点,我不是非常依赖于Jquery框架,因为不同的公司有不同的框架 比如在淘宝用的kissy框架 在支付宝用的是支付宝框架 在百度用的是百度框架 在腾讯有腾讯的前端js框架 假如我的编写代码太依赖于jquery 那假如其他人想要用我代码或者我自己某一天去做腾讯项目了 但是他们那边要求我们只能用他们的JS框架 且又有这样的功能?那如果我完全依赖jquery那种形式编码 那现在我是不是要重新编码呢?如果按照现在编码方式去编码 最多只是用了下jquery选择器而已 那么只要改下选择器 其他的代码都可以直接拿来用,这样的扩张性非常好!我个人觉得作为一个专业的前端开发,不仅仅只会一点点jquery做做东西,而更应该考虑编写高质量的代码,可能用jquery写写简单的代码同样能做好某个东西,但是有没有考虑到假如某一天需求增加了某某功能 你是不是又要改代码?能不能在以前的基础上重新写新的功能?而无需改代码!
何谓高质量的代码?
个人觉得必须满足以下几点:
1. 可扩展性。
2. 可维护性。
3. 可读性,易使用性。
4. JS性能。
最主要满足以上几点。
好了 废话不多说了!转主题,目前我做的这个发表微博效果 只是简单的 当然腾讯发表微博有一些复杂的功能 比如说下面有添加表情等等功能,目前没有做成那样的(工作量比较大)。
下面我写的这个JS代码需要注意2点:
1.每次发表下后 大家在说列表会添加一条,目前没有发ajax请求 后台没有记录 所以刷新
页面 会清掉。
2. 时间是用的是客户端时间 假如客户端时间错误的话 那么时间也会受影响。
其实思路很简单 看上面的效果就明白 所以思路在这边不多说了!或者我下面会提供压缩demo 可以自己下载下来看看效果就ok了!每次发表一次后 都提供了回调 作为扩展吧!当然鼠标移到某一项时候 会出现删除按钮 同时可以任意删除某一项。直接贴代码吧 也没有什么好说的!
HTML代码如下:
复制代码 代码如下:
<div id="msgBox">
<form>
<h2>来 , 说说你在做什么 , 想什么</h2>
<div>
<input id="userName" class="f-text" value="" />
<p id="face">
<img src="img/face1.gif" class="current" />
<img src="img/face2.gif" />
<img src="img/face3.gif" />
<img src="img/face4.gif" />
<img src="img/face5.gif" />
<img src="img/face6.gif" />
<img src="img/face7.gif" />
<img src="img/face8.gif" />
</p>
</div>
<div>
<textarea id="conBox" class="f-text"></textarea>
</div>
<div class="tr">
<p>
<span class="countTxt">还能输入</span><strong class="maxNum">140</strong><span>个字</span>
<input id="sendBtn" type="button" value="" title="快捷键 Ctrl+Enter" />
</p>
</div>
</form>
<div class="list">
<h3><span>大家在说</span></h3>
<ul id="list-msg"></ul>
</div>
</div>
CSS代码如下:
复制代码 代码如下:
body,div,h2,h3,ul,li,p{margin:0;padding:0;}
a{text-decoration:none;}
a:hover{text-decoration:underline;}
ul{list-style-type:none;}
body{color:#333;background:#3c3a3b;font:12px/1.5 \5b8b\4f53;}
#msgBox{width:500px;background:#fff;border-radius:5px;margin:10px
auto;padding-top:10px;}
#msgBox form h2{font-weight:400;font:400 18px/1.5 \5fae\8f6f\96c5\9ed1;}
#msgBox form{background:url(img/boxBG.jpg) repeat-x 0 bottom;padding:0 20px 15px;} #userName,#conBox{color:#777;border:1px solid #d0d0d0;border-radius:6px;background:#fff url(img/inputBG.png) repeat-x;padding:3px 5px;font:14px/1.5 arial;}
#userName.active,#conBox.active{border:1px solid #7abb2c;}
#userName{height:20px;}
#conBox{width:448px;resize:none;height:65px;overflow:auto;}
#msgBox form div{position:relative;color:#999;margin-top:10px;}
#msgBox img{border-radius:3px;}
#face{position:absolute;top:0;left:172px;}
#face
img{float:left;display:inline;width:30px;height:30px;cursor:pointer;margin-right:6px;opacity:0.5;filter:alpha(opacity=50);}
#face img.hover,#face img.current{width:28px;height:28px;border:1px solid #f60;opacity:1;filter:alpha(opacity=100);}
#sendBtn{border:0;width:112px;height:30px;cursor:pointer;margin-left:10px;background:url(img/btn.png) no-repeat;}
#sendBtn.hover{background-position:0 -30px;}
#msgBox form .maxNum{font:26px/30px Georgia, Tahoma, Arial;padding:0 5px;}
#msgBox .list{padding:10px;}
#msgBox .list h3{position:relative;height:33px;font-size:14px;font-weight:400;background:#e3eaec;border:1px
solid #dee4e7;}
#msgBox .list h3 span{position:absolute;left:6px;top:6px;background:#fff;line-height:28px;display:inline-block;padding:0 15px;}
#msgBox .list ul{overflow:hidden;zoom:1;}
#msgBox .list ul li{float:left;clear:both;width:100%;border-bottom:1px dashed #d8d8d8;padding:10px 0;background:#fff;overflow:hidden;}
#msgBox .list ul li.hover{background:#f5f5f5;}
#msgBox .list .userPic{float:left;width:50px;height:50px;display:inline;margin-left:10px;border:1px solid #ccc;border-radius:3px;}
#msgBox .list .content{float:left;width:400px;font-size:14px;margin-left:10px;font-family:arial;word-wrap:break-word;}
#msgBox .list .userName{display:inline;padding-right:5px;}
#msgBox .list .userName a{color:#2b4a78;}
#msgBox .list .msgInfo{display:inline;word-wrap:break-word;}
#msgBox .list .times{color:#889db6;font:12px/18px arial;margin-top:5px;overflow:hidden;zoom:1;}
#msgBox .list .times span{float:left;}
#msgBox .list .times a{float:right;color:#889db6;}
.tr{overflow:hidden;zoom:1;}
.tr p{float:right;line-height:30px;}
.tr *{float:left;}
.hidden {display:none;}
JS代码如下:
复制代码 代码如下:
/**
* 仿腾讯发表微博的效果
* 1.目前没有发ajax请求 后台没有记录 所以刷新页面 会清掉
* 2. 时间是用的是客户端时间 假如客户端时间错误的话 那么时间也会受影响。
* 目前就这样交互 具体的思路不太复杂 如果项目中用到这样的 可以根据具体的需求更改
* @constructor Microblog
* @date 2013-12-23
* @author tugenhua
* @email 879083421@qq.com
*/
function Microblog(options) {
this.config = {
maxNum : 140, // 最大的字符数 targetElem : '.f-text', // 输入框 或者文本域的class名
maxNumElem : '.maxNum', // 还能输入多少字容器
sendBtn : '#sendBtn', // 广播按钮
face : '#face', // 表情容器
activeCls : 'active', // 鼠标点击输入框add类 currentCls : 'current', // 鼠标点击face头像时 增加的类名
inputID : '#userName', // 输入框ID textareaId : '#conBox', // 文本域ID
list : '#list-msg', // 大家在说的容器
callback : null // 动态广播完后的回调函数
};
this.cache = {};
this.init(options);
}
Microblog.prototype = {
constructor: Microblog,
init: function(options) {
this.config = $.extend(this.config,options || {});
var self = this,
_config = self.config,
_cache = self.cache;
// 点击输入框input 文本域 textarea 边框的变化
$(_config.targetElem).each(function(index,item){
$(item).unbind('focus');
$(item).bind('focus',function(e){
!$(this).hasClass(_config.activeCls) && $(this).addClass(_config.activeCls); });{android仿qq说说上传图片demo}.
$(item).unbind('blur');
android仿qq说说上传图片demo篇四
android仿QQ topbar按钮被选择时背景图片移动效果
博客分类:
ANDROID QQ截图:
DEMO截图:
Java代码
public class test3 extends Activity { private NewLayOut layout;
private myThread mThread; @Override public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState); LayoutInflater inflater = (LayoutInflater)getSystemService(LAYOUT_INFLATER_SERVICE); layout = (NewLayOut) inflater.inflate(R.layout.move, null);
ImageView button = (ImageView)layout.findViewById(R.id.ImageView01); button.setOnClickListener(mClickListener);
ImageView button2 = (ImageView)layout.findViewById(R.id.ImageView02); button2.setOnClickListener(mClickListener); ImageView button3 = (ImageView)layout.findViewById(R.id.ImageView03);
button3.setOnClickListener(mClickListener); this.setContentView(layout); }
private View.OnClickListener mClickListener = new View.OnClickListener() {
public void onClick(View v) { startMove(v); } };
private void startMove(View v) {
stopThread();//停止之前的线程
mThread = new myThread(v); mThread.start();
} private void stopThread() { if (mThread != null)
{ try { layout.mIsStop = true;
mThread.join(); } catch(Exception e) {
e.printStackTrace(); } } }
class myThread extends Thread { private View mView;
public myThread(View v){ this.mView = v; } public void run() { layout.doWork(this.mView);
} } }
Java代码
package test3.program;
import android.content.Context;{android仿qq说说上传图片demo}.
import android.graphics.Canvas; import android.graphics.Rect;
import android.graphics.BitmapFactory; import android.graphics.drawable.BitmapDrawable; import android.util.AttributeSet; import android.view.View;
import android.widget.LinearLayout; public class NewLayOut extends LinearLayout {
private static final short SPEED = 15; private Context mContext;
private Rect mNowRect;//当前的区域
private Rect mEndRect;//结束的区域
private BitmapDrawable mSelecter;//移动的半透明背景bitmaip private boolean mSyn = false;//循环和onDraw同步
public boolean mIsStop = false;//是否到达指定区域
public NewLayOut(Context context) { super(context); init(context);
} public NewLayOut(Context context, AttributeSet attrs) { super(context, attrs);
init(context); } private void init(Context context)
{ mContext = context; mSelecter = new BitmapDrawable( BitmapFactory.decodeResource(mContext.getResources(), R.drawable.topbar_select)); mNowRect = new Rect();
mEndRect = new Rect(); }
protected void onLayout(boolean paramBoolean, int paramInt1, int paramInt2, int paramInt3, int paramInt4) {
super.onLayout(paramBoolean, paramInt1, paramInt2, paramInt3, paramInt4);
this.getChildAt(0).getHitRect(mNowRect);//取得第一个控制区域作为起始区域
} /**
*
* @param v 目标控件
*/ public void doWork(View v) { v.getHitRect(this.mEndRect);
if (this.mNowRect.right < this.mEndRect.right) { work(new RunForword()
{ public void run() {
mNowRect.left += SPEED;//每次左边移动15格 mNowRect.right += SPEED;//每次右边移动15格 System.out.println("is run run run");
if (mNowRect.right >= mEndRect.right)//如果移动超出或等于目标区域
ReachRect(); } }); }
else if(this.mNowRect.right > this.mEndRect.right) { work(new RunForword() {
public void run() {
mNowRect.left -= SPEED;//每次左边移动15格 mNowRect.right -= SPEED;//每次右边移动15格
if (mNowRect.right <= mEndRect.right)//如果移动超出或等于目标区域
ReachRect(); }
}); } } private void work(RunForword run)
{ this.mIsStop = false; while(!this.mIsStop)
{
if(this.mSyn)//画图与循环同步 { run.run(); System.out.println("is running!"); this.mSyn = false; this.postInvalidate(); //Thread.sleep(35); }
} } /**
* 到达目的地
*/ private void ReachRect()
{ mNowRect.left = mEndRect.left; mNowRect.right = mEndRect.right; mIsStop = true;
} protected void onDraw(Canvas canvas) {
super.onDraw(canvas); mSelecter.setBounds(mNowRect); mSelecter.draw(canvas);
this.mSyn = true; System.out.println("is ondraw"); }