900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > android开发--仿微信朋友圈界面

android开发--仿微信朋友圈界面

时间:2020-10-05 20:43:06

相关推荐

android开发--仿微信朋友圈界面

话不多说,先来看两张效果图

看图片效果还凑合,就是“朋友圈”三个字和头像的动画过渡效果和微信朋友圈的实际效果还是有点差距,可以的话以后慢慢再优化吧,这里贴出相关的代码,可能部分代码比较多余,以后再做修改吧

一:界面布局代码:

<?xml version="1.0" encoding="utf-8"?><android.support.design.widget.CoordinatorLayoutxmlns:android="/apk/res/android"xmlns:app="/apk/res-auto"android:fitsSystemWindows="true"android:layout_width="match_parent"android:layout_height="match_parent"><android.support.design.widget.AppBarLayoutandroid:id="@+id/appBar"android:layout_width="match_parent"android:fitsSystemWindows="true"android:layout_height="320dp"><android.support.design.widget.CollapsingToolbarLayoutandroid:id="@+id/collapsing_toolbar"android:layout_width="match_parent"android:layout_height="match_parent"android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"android:fitsSystemWindows="true"app:contentScrim="?attr/colorPrimary"app:layout_scrollFlags="scroll|exitUntilCollapsed"><ImageViewandroid:id="@+id/friends_image_view"android:layout_width="match_parent"android:layout_height="match_parent"android:fitsSystemWindows="true"android:src="@drawable/apple"android:scaleType="centerCrop"app:layout_collapseMode="parallax" /><Buttonandroid:id="@+id/back_view"android:layout_width="20dp"android:layout_height="20dp"android:background="@drawable/ic_back"android:fitsSystemWindows="true"app:layout_collapseMode="pin"android:layout_marginTop="42dp"android:layout_marginLeft="2dp" /><Buttonandroid:layout_width="20dp"android:layout_height="20dp"android:fitsSystemWindows="true"android:background="@drawable/ic_camera"android:layout_gravity="right"app:layout_collapseMode="pin"android:layout_marginTop="40dp"android:layout_marginRight="5dp" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="昵称"android:layout_gravity="bottom|right"android:layout_marginRight="100dp"android:layout_marginBottom="5dp"/><android.support.v7.widget.Toolbarandroid:id="@+id/toolbar_view"android:layout_width="match_parent"android:layout_height="?attr/actionBarSize"android:fitsSystemWindows="true"app:layout_collapseMode="pin" /></android.support.design.widget.CollapsingToolbarLayout></android.support.design.widget.AppBarLayout><android.support.v7.widget.RecyclerViewandroid:id="@+id/recycler_view"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_marginTop="30dp"app:layout_behavior="@string/appbar_scrolling_view_behavior"/><ImageViewandroid:id="@+id/image1"android:layout_width="80dp"android:layout_height="80dp"android:layout_margin="10dp"android:background="@drawable/nav_icon"app:layout_anchor="@id/appBar"app:layout_anchorGravity="bottom|end" /></android.support.design.widget.CoordinatorLayout>

由于这当中用到了recyclerview,所以还得写一个子项的布局代码,如下:

<?xml version="1.0" encoding="utf-8"?><android.support.v7.widget.CardViewxmlns:android="/apk/res/android"xmlns:app="/apk/res-auto"android:layout_width="match_parent"android:layout_height="wrap_content"><RelativeLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"><ImageViewandroid:id="@+id/image2"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/orange"android:layout_marginLeft="8dp"android:layout_marginTop="10dp"/><LinearLayoutandroid:id="@+id/linear1"android:layout_toRightOf="@id/image2"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="vertical"android:layout_marginLeft="5dp"android:layout_marginTop="10dp"><TextViewandroid:id="@+id/friend_name"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="好友昵称"android:textColor="#2CA3E5"/><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginTop="5dp"android:text="好友所发状态内容"/></LinearLayout><LinearLayoutandroid:id="@+id/linear2"android:layout_below="@id/linear1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginTop="10dp"android:layout_alignLeft="@id/linear1"><ImageViewandroid:id="@+id/friend_image"android:layout_width="60dp"android:layout_height="60dp"android:background="@drawable/banana" /><ImageViewandroid:id="@+id/friend_imag"android:layout_width="60dp"android:layout_height="60dp"android:background="@drawable/pear"android:visibility="gone"/><ImageViewandroid:id="@+id/friend_ima"android:layout_width="60dp"android:layout_height="60dp"android:background="@drawable/pineapple"android:visibility="gone"/></LinearLayout><TextViewandroid:id="@+id/time_text"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@id/linear2"android:layout_alignLeft="@id/linear1"android:layout_marginTop="10dp"android:text="30分钟前"/><Buttonandroid:layout_width="20dp"android:layout_height="20dp"android:layout_alignBottom="@+id/time_text"android:layout_alignParentRight="true"android:layout_marginRight="10dp"android:background="@drawable/ic_comment"/><Viewandroid:layout_below="@+id/time_text"android:layout_width="match_parent"android:layout_height="1dp"android:layout_marginTop="20dp"android:background="@android:color/darker_gray" /></RelativeLayout></android.support.v7.widget.CardView>

Friend类:

package com.example.wechattest;public class Friend {private int imageId;public Friend(int imageId) {this.imageId = imageId;}public int getImageId() {return imageId;}}

FriendAdapter类:

package com.example.wechattest;import android.content.Context;import android.support.v7.widget.CardView;import android.support.v7.widget.RecyclerView;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.ImageView;import java.util.List;import java.util.Random;public class FriendAdapter extends RecyclerView.Adapter<FriendAdapter.ViewHolder> {private Context mContext;private List<Friend> mFriendList;static class ViewHolder extends RecyclerView.ViewHolder {CardView cardView;ImageView image1;ImageView image2;ImageView image3;public ViewHolder(View view) {super(view);cardView = (CardView) view;image1 = (ImageView) view.findViewById(R.id.friend_image);image2 = (ImageView) view.findViewById(R.id.friend_imag);image3 = (ImageView) view.findViewById(R.id.friend_ima);}}public FriendAdapter(List<Friend> friendList) {mFriendList = friendList;}@Overridepublic ViewHolder onCreateViewHolder(ViewGroup parent,int viewType) {if (mContext == null) {mContext = parent.getContext();}View view = LayoutInflater.from(mContext).inflate(R.layout.friend_item,parent,false);return new ViewHolder(view);}@Overridepublic void onBindViewHolder(ViewHolder holder,int position) {getRandomLength();holder.image2.setVisibility(View.GONE);holder.image3.setVisibility(View.GONE);if (getRandomLength() == 1) {holder.image1.setVisibility(View.VISIBLE);} else if (getRandomLength() == 2) {holder.image1.setVisibility(View.VISIBLE);holder.image2.setVisibility(View.VISIBLE);} else if (getRandomLength() == 3) {holder.image1.setVisibility(View.VISIBLE);holder.image2.setVisibility(View.VISIBLE);holder.image3.setVisibility(View.VISIBLE);}}@Overridepublic int getItemCount() {return mFriendList.size();}private int getRandomLength() {Random random = new Random();int length = random.nextInt(3) + 1;return length;}}

主活动代码:

package com.example.wechattest;import android.graphics.Color;import android.support.design.widget.AppBarLayout;import android.support.design.widget.CollapsingToolbarLayout;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.support.v7.widget.LinearLayoutManager;import android.support.v7.widget.RecyclerView;import android.view.View;import android.widget.Button;import android.widget.ImageView;import java.util.ArrayList;import java.util.List;import java.util.Random;public class FriendsActivity extends AppCompatActivity {private Friend[] friends = {new Friend(R.drawable.banana),new Friend(R.drawable.orange),new Friend(R.drawable.pear)};private List<Friend> friendList = new ArrayList<>();private FriendAdapter adapter;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_friends);AppBarLayout appBarLayout = findViewById(R.id.appBar);appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {@Overridepublic void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {CollapsingToolbarLayout collapsingToolbar = findViewById(R.id.collapsing_toolbar);int color = Color.argb(200,0,0,0);collapsingToolbar.setCollapsedTitleTextColor(color);ImageView imageView = findViewById(R.id.image1);if (Math.abs(verticalOffset) >= appBarLayout.getTotalScrollRange()) { // 折叠状态collapsingToolbar.setTitle("朋友圈");imageView.setVisibility(View.GONE);} else { // 非折叠状态collapsingToolbar.setTitle("");imageView.setVisibility(View.VISIBLE);}}});Button backButton = (Button) findViewById(R.id.back_view);backButton.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {finish();}});initFriends();RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);LinearLayoutManager layoutManager = new LinearLayoutManager(this);recyclerView.setLayoutManager(layoutManager);adapter = new FriendAdapter(friendList);recyclerView.setAdapter(adapter);}private void initFriends() {friendList.clear();for (int i = 0; i < 40; i++) {Random random = new Random();int index = random.nextInt(friends.length);friendList.add(friends[index]);}}}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。