Android仿QQ空间主页面的实现
2023-06-13 09:14:43 时间
今天模仿安卓QQ空间，效果如下：
打开程序的启动画面和导航页面我就不做了，大家可以模仿微信的那个做一下，很简单。这次主要做一下主页面的实现，下面是主页面的布局：
复制代码代码如下:
打开程序的启动画面和导航页面我就不做了，大家可以模仿微信的那个做一下，很简单。这次主要做一下主页面的实现，下面是主页面的布局：
<?xmlversion="1.0"encoding="utf-8"?>
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@android:color/white"
android:orientation="vertical">
<include
android:id="@+id/top_layout"
layout="@layout/main"/>
</LinearLayout>
里面引用了main这个布局文件，它的xml文件为：
<?xmlversion="1.0"encoding="utf-8"?>
<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="40dip"
android:layout_alignParentTop="true"
android:background="@drawable/navbar_bg">
<TextView
android:id="@+id/titltext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我的空间动态"
android:textSize="20dp"
android:layout_centerInParent="true"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@drawable/navbar_drop_down"
android:id="@+id/bytextimage1"
android:layout_toRightOf="@id/titltext"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@drawable/navbar_drop_up"
android:id="@+id/bytextimage2"
android:visibility="invisible"
android:layout_toRightOf="@id/titltext"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginTop="5dp"
android:layout_marginRight="10dp"
android:src="@drawable/icon_refresh_none"/>
</RelativeLayout>//这个RelativeLayout是最上面“我的空间动态”那一部分的布局
<FrameLayout//下面的导航栏的实现，他的背景就是灰色横条的那一部分
android:layout_width="fill_parent"
android:layout_height="65.32999dip"
android:layout_alignParentBottom="true"
android:background="@drawable/toolbar_bg">
<LinearLayout//用来包含图片以及文字
android:layout_width="fill_parent"
android:layout_height="48.0dip"
android:layout_gravity="bottom"
android:baselineAligned="false"
android:gravity="center_horizontal"
android:orientation="horizontal">
<FrameLayout//采用帧布局，这样图片和文字就可以一起显示了。当然也可以用相对布局，一个在上，一个在下。
android:layout_width="fill_parent"
android:layout_height="48.0dip"
android:layout_weight="1.0">
<ImageView
android:layout_width="28.0dip"
android:layout_height="28.0dip"
android:layout_gravity="top|center"
android:layout_marginTop="1.0dip"
android:contentDescription=""
android:src="@drawable/tab_timefeed_opacity"
android:visibility="visible"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:layout_marginBottom="6.0dip"
android:text="好友动态"
android:textColor="#ffffffff"
android:textSize="10.0dip"
android:visibility="visible"/>
</FrameLayout>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="48.0dip"
android:layout_marginRight="10.0dip"
android:layout_weight="1.0">
<ImageView
android:layout_width="27.0dip"
android:layout_height="27.0dip"
android:layout_gravity="top|center"
android:layout_marginTop="1.0dip"
android:src="@drawable/tab_feedback_opacity"
android:visibility="visible"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:layout_marginBottom="6.0dip"
android:text="与我相关"
android:textColor="#ffffffff"
android:textSize="10.0dip"
android:visibility="visible"/>
<TextView
android:layout_width="17.0dip"
android:layout_height="17.0dip"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="15.0dip"
android:layout_marginLeft="10.0dip"
android:background="@drawable/myhome_visitor_number"
android:gravity="center_vertical"
android:paddingBottom="5.0dip"
android:paddingLeft="5.0dip"
android:paddingRight="0.0dip"
android:paddingTop="0.0dip"
android:text="n"
android:textColor="#ffffffff"
android:textSize="13.0dip"
android:visibility="visible"/>
</FrameLayout>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.0"/>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="48.0dip"
android:layout_marginLeft="10.0dip"
android:layout_weight="1.0">
<ImageView
android:layout_width="27.0dip"
android:layout_height="27.0dip"
android:layout_gravity="top|center"
android:layout_marginTop="1.0dip"
android:src="@drawable/tab_myzone_opacity"
android:visibility="visible"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:layout_marginBottom="6.0dip"
android:text="主页"
android:textColor="#ffffffff"
android:textSize="10.0dip"
android:visibility="visible"/>
</FrameLayout>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="48.0dip"
android:layout_weight="1.0">
<ImageView
android:layout_width="27.0dip"
android:layout_height="27.0dip"
android:layout_gravity="top|center"
android:layout_marginTop="1.0dip"
android:src="@drawable/tab_applist_opacity"
android:visibility="visible"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center"
android:layout_marginBottom="6.0dip"
android:text="应用"
android:textColor="#ffffffff"
android:textSize="10.0dip"
android:visibility="visible"/>
</FrameLayout>
</LinearLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal">
<ImageView
android:layout_width="66.666595dip"
android:layout_height="65.33328dip"
android:layout_gravity="center"
android:src="@drawable/toolbar_write_bg"/>
</FrameLayout>
<FrameLayout
android:id="@+id/btn_ck"
android:layout_width="65.33328dip"
android:layout_height="65.33328dip"
android:layout_gravity="center">
<ImageView
android:id="@+id/image1"
android:layout_width="22.666595dip"
android:layout_height="22.666595dip"
android:layout_gravity="center"
android:layout_marginTop="2.0dip"
android:src="@drawable/toolbar_plus"/>
</FrameLayout>
</FrameLayout>
</RelativeLayout>
上面的“我的空间动态”以及下面的圆形Button用的是PopubWindow，Activity的代码如下：
packagecom.example.imitateqqzone;
importjava.util.ArrayList;
importjava.util.List;
importandroid.os.Bundle;
importandroid.app.Activity;
importandroid.content.Context;
importandroid.graphics.drawable.BitmapDrawable;
importandroid.view.LayoutInflater;
importandroid.view.Menu;
importandroid.view.View;
importandroid.view.View.OnClickListener;
importandroid.view.Window;
importandroid.widget.AdapterView;
importandroid.widget.ImageView;
importandroid.widget.LinearLayout;
importandroid.widget.ListView;
importandroid.widget.PopupWindow;
importandroid.widget.TextView;
importandroid.widget.AdapterView.OnItemClickListener;
importandroid.widget.Toast;
publicclassImitateQQZoneextendsActivity{
privatePopupWindowpopupWindow1,popupWindow2;
privateListViewlv_group;
privateViewview,top_layout;
privateTextViewtvtitle;
privateList<String>groups;
//privateintscreenWidth,screenHeight,dialgoWidth,dialgoheight;
privateImageViewbyTextImageView1,byTextImageView2,centerimage;
//privateint[]images={R.drawable.navbar_drop_down,R.drawable.navbar_drop_up};
@Override
publicvoidonCreate(BundlesavedInstanceState){
super.onCreate(savedInstanceState);
this.requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_imitate_qqzone);
top_layout=this.findViewById(R.id.top_layout);
tvtitle=(TextView)top_layout.findViewById(R.id.titltext);
byTextImageView1=(ImageView)top_layout.findViewById(R.id.bytextimage1);
byTextImageView2=(ImageView)top_layout.findViewById(R.id.bytextimage2);
centerimage=(ImageView)findViewById(R.id.image1);
/*
*androidviewsetVisibility():
有三个参数：Parameters:visibilityOneofVISIBLE,INVISIBLE,orGONE，想对应的三个常量值：0、4、8
VISIBLE:0意思是可见的
INVISIBILITY:4意思是不可见的，但还占着原来的空间
GONE:8意思是不可见的，不占用原来的布局空间
*/
tvtitle.setOnClickListener(newOnClickListener(){
booleanisImage=false;
publicvoidonClick(Viewv){
showWindow1(v);
if(isImage==false){
isImage=true;
byTextImageView1.setVisibility(4);
byTextImageView2.setVisibility(0);
}else{
isImage=false;
byTextImageView1.setVisibility(0);
byTextImageView2.setVisibility(4);
}
}
});
centerimage.setOnClickListener(newOnClickListener(){
publicvoidonClick(Viewv){
showWindow2(v);
}
});
}
protectedvoidshowWindow2(Viewv){
if(popupWindow2==null){
LayoutInflaterlayoutInflater=(LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
view=layoutInflater.inflate(R.layout.pubmenu,null);
popupWindow2=newPopupWindow(view,400,400);//创建一个PopuWidow对象
}
popupWindow2.setFocusable(true);//使其聚集
popupWindow2.setOutsideTouchable(true);//设置允许在外点击消失
popupWindow2.setBackgroundDrawable(newBitmapDrawable());//这个是为了点击“返回Back”也能使其消失，并且并不会影响你的背景
popupWindow2.showAsDropDown(v);
}
privatevoidshowWindow1(Viewparent){
if(popupWindow1==null){
LayoutInflaterlayoutInflater=(LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
view=layoutInflater.inflate(R.layout.group_list,null);
lv_group=(ListView)view.findViewById(R.id.lvGroup);
//加载数据
groups=newArrayList<String>();
groups.add("全部动态");
groups.add("好友动态");
groups.add("特别关心");
groups.add("认证空间");
GroupAdaptergroupAdapter=newGroupAdapter(this,groups);
lv_group.setAdapter(groupAdapter);
//创建一个PopuWidow对象
popupWindow1=newPopupWindow(view,200,350);
}
popupWindow1.setFocusable(true);//使其聚集
popupWindow1.setOutsideTouchable(true);//设置允许在外点击消失
popupWindow1.setBackgroundDrawable(newBitmapDrawable());//这个是为了点击“返回Back”也能使其消失，并且并不会影响你的背景
//screenWidth=ImitateQQZone.this.getWindowManager().getDefaultDisplay().getWidth();
//screenHeight=ImitateQQZone.this.getWindowManager().getDefaultDisplay().getHeight();
//dialgoWidth=popupWindow.getWidth();
//dialgoheight=popupWindow.getHeight();
//intxPos=(screenWidth-dialgoWidth)/2;//显示的位置为:屏幕的宽度的一半-PopupWindow的宽度的一半
//Log.i("coder","xPos:"+xPos);
popupWindow1.showAsDropDown(parent);
lv_group.setOnItemClickListener(newOnItemClickListener(){
publicvoidonItemClick(AdapterView<?>adapterView,Viewview,
intposition,longid){
Toast.makeText(ImitateQQZone.this,groups.get(position),1000)
.show();
//switch(position){
//case0:
//Intentintent=newIntent(ImitateQQZone.this,
//PopupWindowDemo2.class);
//startActivity(intent);
///break;
//default:
//break;
//}
if(popupWindow1!=null){
popupWindow1.dismiss();
}
}
});
}
@Override
publicbooleanonCreateOptionsMenu(Menumenu){
getMenuInflater().inflate(R.menu.activity_imitate_qqzone,menu);
returntrue;
}
}
其他的布局文件我就不贴出了，需要代码的可以@我或在下面留言，这只是个Demo，因为时间关系，还有很多细节没有实现。大家可以在我的基础上继续完善。
相关文章
- android onresume方法,非静态方法’onResume’Android Studio
- android bugku ctf mobile做题过程记录
- android-短信验证功能,Android实现获取短信验证码的功能以及自定义GUI短信验证详解…
- android短信验证码方案,Android之短信验证码
- android线程间通信的几种方法_Android进程间和线程间通信方式
- 【Android Gradle 插件】Gradle 依赖管理 ① ( org.gradle.api.Project 配置 | Android Gradle 插件配置与 Gradle 配置关联 ) ★
- Android开发中遇到的问题(三)——eclipse创建android项目无法正常预览布局文件详解手机开发
- android 二维码简化，实现仿qq扫描效果详解手机开发
- Linux安装QQ：让你畅游沟通世界（linux下qq安装）
- 轻松开启Linux的社交时代：安装Linux版QQ（linux版qq）
- Android实现PHP连接MySQL进行数据交互（android通过php连接mysql）
- 使用Android实现连接MySQL数据库：实现快速数据交互与管理（android连接mysql数据库）
- Android实现类似360,QQ管家那样的悬浮窗
- android计算器代码示例分享