Android仿微博首页Tab加号弹窗功能

本文实例为大家分享了Android微博首页Tab加号弹窗展示的具体代码,供大家参考,具体内容如下

Activity部分的代码

package com.ting.tab;

import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.CompoundButton;
import android.widget.RadioButton;

import com.ting.ContentActivity0;
import com.ting.ContentActivity1;
import com.ting.ContentActivity2;
import com.ting.ContentActivity3;
import com.ting.ContentActivity4;
import com.ting.R;

public class TabActivityGroup extends AbstractActivityGroup implements View.OnClickListener, View.OnTouchListener {
 // 加载的Activity的名字,LocalActivityManager就是通过这些名字来查找对应的Activity的。
 private static final String CONTENT_0 = "contentActivity0";
 private static final String CONTENT_1 = "contentActivity1";
 private static final String CONTENT_2 = "contentActivity2";
 private static final String CONTENT_3 = "contentActivity3";
 private static final String CONTENT_4 = "contentActivity4";
 private View addButton;
 private View mPanelView;
 private View mCloseButton;
 private View mIdeaButton;
 private View mPhotoButton;
 private View mWeiboButton;
 private View mLbsButton;
 private View mReviewButton;
 private View mMoreButton;
 private Animation mButtonInAnimation;
 private Animation mButtonOutAnimation;
 private Animation mButtonScaleLargeAnimation;
 private Animation mButtonScaleSmallAnimation;
 private Animation mCloseRotateAnimation;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  setContentView(R.layout.activity_tab);
  super.onCreate(savedInstanceState);
  initView();
  initAnimation();
  ((RadioButton) findViewById(R.id.radio_button0)).setChecked(true);
  setContainerView(CONTENT_0, ContentActivity0.class);
 }

 /**
 * 找到自定义id的加载Activity的View
 */
 @Override
 protected ViewGroup getContainer() {
  return (ViewGroup) findViewById(R.id.container);
 }

 /**
 * 初始化按钮
 */
 @Override
 protected void initTabBarButtons() {
  initTabBarButton(R.id.radio_button0);
  initTabBarButton(R.id.radio_button1);
// initTabBarButton(R.id.radio_button2);
  initTabBarButton(R.id.radio_button3);
  initTabBarButton(R.id.radio_button4);
 }

 /**
 * 导航按钮被点击时,具体发生的变化
 */
 @Override
 public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
  if (isChecked) {
   switch (buttonView.getId()) {

   case R.id.radio_button0:
   setContainerView(CONTENT_0, ContentActivity0.class);
   break;

   case R.id.radio_button1:
   setContainerView(CONTENT_1, ContentActivity1.class);
   break;

   case R.id.radio_button2:
//   setContainerView(CONTENT_2, ContentActivity2.class);
   break;

   case R.id.radio_button3:
   setContainerView(CONTENT_3, ContentActivity3.class);
   break;

   case R.id.radio_button4:
   setContainerView(CONTENT_4, ContentActivity4.class);
   break;

   default:
   break;
   }
  }
 }
 //以下是仿微博加号控件添加代码
 private void initView() {
  addButton = findViewById(R.id.radio_button2);
  mPanelView = findViewById(R.id.panel);
  mCloseButton = findViewById(R.id.close);
  mIdeaButton = findViewById(R.id.idea_btn);
  mPhotoButton = findViewById(R.id.photo_btn);
  mWeiboButton = findViewById(R.id.weibo_btn);
  mLbsButton = findViewById(R.id.lbs_btn);
  mReviewButton = findViewById(R.id.review_btn);
  mMoreButton = findViewById(R.id.more_btn);

  addButton.setOnClickListener(this);
  mCloseButton.setOnClickListener(this);

  mIdeaButton.setOnTouchListener(this);
  mPhotoButton.setOnTouchListener(this);
  mWeiboButton.setOnTouchListener(this);
  mLbsButton.setOnTouchListener(this);
  mReviewButton.setOnTouchListener(this);
  mMoreButton.setOnTouchListener(this);
 }

 @Override
 public void onClick(View view) {
  switch (view.getId()) {
   case R.id.radio_button2:// 添加按钮
   openPanelView();
   break;
   case R.id.close:// 关闭按钮
   closePanelView();
   break;
  }
 }

 @Override
 public boolean onTouch(final View v, MotionEvent event) {
  switch (event.getAction()) {
   case MotionEvent.ACTION_DOWN:
   // 手指按下,按钮执行放大动画
   v.startAnimation(mButtonScaleLargeAnimation);
   break;
   case MotionEvent.ACTION_UP:
   case MotionEvent.ACTION_CANCEL:
   // 手指移开,按钮执行缩小动画
   v.startAnimation(mButtonScaleSmallAnimation);
   v.postDelayed(new Runnable() {
    @Override
    public void run() {
     // 缩小动画执行完毕后,将按钮的动画清除。这里的150毫秒是缩小动画的执行时间。
     v.clearAnimation();
    }
   }, 150);
   break;
  }
  return true;
 }
 // 打开面板视图
 private void openPanelView() {
  mPanelView.setVisibility(View.VISIBLE);

  mIdeaButton.startAnimation(mButtonInAnimation);
  mPhotoButton.startAnimation(mButtonInAnimation);
  mWeiboButton.startAnimation(mButtonInAnimation);
  mLbsButton.startAnimation(mButtonInAnimation);
  mReviewButton.startAnimation(mButtonInAnimation);
  mMoreButton.startAnimation(mButtonInAnimation);

  mCloseButton.startAnimation(mCloseRotateAnimation);
 }

 // 关闭面板视图
 private void closePanelView() {
  // 给6个按钮添加退出动画
  mIdeaButton.startAnimation(mButtonOutAnimation);
  mPhotoButton.startAnimation(mButtonOutAnimation);
  mWeiboButton.startAnimation(mButtonOutAnimation);
  mLbsButton.startAnimation(mButtonOutAnimation);
  mReviewButton.startAnimation(mButtonOutAnimation);
  mMoreButton.startAnimation(mButtonOutAnimation);
 }
 // 初始化动画
 private void initAnimation() {
  mButtonInAnimation = AnimationUtils.loadAnimation(this, R.anim.button_in);
  mButtonOutAnimation = AnimationUtils.loadAnimation(this, R.anim.button_out);
  mButtonScaleLargeAnimation = AnimationUtils.loadAnimation(this, R.anim.button_scale_to_large);
  mButtonScaleSmallAnimation = AnimationUtils.loadAnimation(this, R.anim.button_scale_to_small);
  mCloseRotateAnimation = AnimationUtils.loadAnimation(this, R.anim.close_rotate);

  mButtonOutAnimation.setAnimationListener(new Animation.AnimationListener() {
   @Override
   public void onAnimationStart(Animation animation) {
   }

   @Override
   public void onAnimationEnd(Animation animation) {
   // 6个按钮的退出动画执行完毕后,将面板隐藏
   mPanelView.setVisibility(View.GONE);
   }

   @Override
   public void onAnimationRepeat(Animation animation) {
   }
  });
 }
}

XML 代码

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:orientation="vertical">

 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical"
  >

  <FrameLayout
   android:id="@+id/container"
   android:layout_width="fill_parent"
   android:layout_height="0dp"
   android:layout_weight="1"
   />

  <RadioGroup
   android:id="@+id/main_tabs"
   style="@style/tab_bar" >

   <RadioButton
    android:id="@+id/radio_button0"
    style="@style/tab_bar_item"
    android:checked="true"
    android:drawableTop="@drawable/icon_home"
    android:text="首页" />

   <RadioButton
    android:id="@+id/radio_button1"
    style="@style/tab_bar_item"
    android:drawableTop="@drawable/icon_meassage"
    android:text="消息" />

   <RelativeLayout
    android:id="@+id/radio_button2"
    android:layout_height="38dp"
    android:layout_width="40dp"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp"
    android:gravity="center"
    android:background="@drawable/tabbar_compose_bg_add_selector"
    >
    <ImageView
     android:layout_height="match_parent"
     android:layout_width="wrap_content"
     android:src="@drawable/tabbar_compose_icon_add_selector"/>
   </RelativeLayout>

   <!--android:drawableTop="@drawable/icon_selfinfo"-->
   <!--android:text="好友"-->

   <RadioButton
    android:id="@+id/radio_button3"
    style="@style/tab_bar_item"
    android:drawableTop="@drawable/icon_square"
    android:text="广场" />

   <RadioButton
    android:id="@+id/radio_button4"
    style="@style/tab_bar_item"
    android:drawableTop="@drawable/icon_more"
    android:text="更多" />
  </RadioGroup>
 </LinearLayout>
 <include layout="@layout/view_add"/>
</FrameLayout>

自己刚刚需要做一个微博首页的加号动态的效果的界面,于是在网上找相关资源,但找到的都是独立的一个加号的显示效果,没有一个完整的tab中的效果,于是就整合了一个,分享给大家!

源码下载:高仿微博首页tab加号效果

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android仿支付宝支付从底部弹窗效果

    我们再用支付宝支付的时候,会从底部弹上来一个对话框,让我们选择支付方式等等,今天我们就来慢慢实现这个功能 效果图 实现 主界面很简单,就是一个按钮,点击后跳到支付详情的Fragment中 package com.example.hfs.alipayuidemo; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.wi

  • Android自定义带增长动画和点击弹窗提示效果的柱状图DEMO

    项目中最近用到各种图表,本来打算用第三方的,例如MPAndroid,这是一个十分强大的图表库,应用起来十分方便,但是最终发现和设计不太一样,没办法,只能自己写了.今天将写好的柱状图的demo贴在这,该柱状图可根据数据的功能有一下几点: 1. 根据数据的多少,动态的绘制柱状图柱子的条数: 2. 柱状图每条柱子的绘制都有动态的动画效果: 3. 每条柱子有点击事件,点击时弹出提示框,显示相关信息,规定时间后,弹窗自动消失. 好了,先上演示图: 下边贴出相关代码: 自定义柱状图类: package co

  • Android程序开发仿新版QQ锁屏下弹窗功能

    新版的qq,可以在锁屏下弹窗显示qq消息,正好目前在做的项目也需要这一功能.经过各种试验和资料查找,终于实现,过程不难,但是却有一些地方需要注意. 下面是实现过程. 1.使用Activity,而不是View QQ的弹窗一开始我以为是悬浮View,用WindowManager去添加,但是无论如何就是不显示,后来在朋友提示下换成Activity来实现,在锁屏状态下就能弹窗了. 2.Activity的设置 Activity需要进行以下设置,才可以在锁屏状态下弹窗. 首先是onCreate方法,需要添加

  • Android UI设计之AlertDialog弹窗控件

    有关android的弹窗界面相信大家见过不少了,手机上很多应用软件都涉及到弹窗控件,比如典型的每次删除一个图片或者卸载一个等都会弹出一个窗口询问是否删除/卸载等,还有我们系统的设置时间/日期等,都用到了这样的控件,下面我将通过代码来总结下常用的几个弹窗控件 activity_main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http:/

  • Android控件PopupWindow模仿ios底部弹窗

    前言 在H5火热的时代,许多框架都出了底部弹窗的控件,在H5被称为弹出菜单ActionSheet,今天我们也来模仿一个ios的底部弹窗,取材于苹果QQ的选择头像功能. 正文 废话不多说,先来个今天要实现的效果图 整个PopupWindow的开启代码 private void openPopupWindow(View v) { //防止重复按按钮 if (popupWindow != null && popupWindow.isShowing()) { return; } //设置Popup

  • Android如何实现锁屏状态下弹窗

    前言 想在锁屏上面实现弹窗,第一个想法就是利用 WindowManager 设置 Window 的 Flag,通过设置 Flag 的显示优先级来让窗口显示在锁屏的上面. 接下来就是试验可能相关的 Window Type 属性,验证该方案是否可行. 在尝试各个 Window Type 属性之前需要明确各个 Type 所需要的权限,下面是 com.android.internal.policy.impl.PhoneWindowManager.checkAddPermission 的源码: publi

  • Android仿支付宝微信支付密码界面弹窗封装dialog

    一,功能效果 二,实现过程 1,先写xml文件:dialog_keyboard.xml 注意事项 (1),密码部分用的是一个线性布局中6个TextView,并设置android:inputType="numberPassword",外框是用的一个有stroke属性的shape, (2),1-9数字是用的recycleview ,每个item的底部和右边有1dp的黑线,填充后形成分割线. (3),recycleview 要设置属性  android:overScrollMode=&quo

  • Android监听输入法弹窗和关闭的实现方法

    用过ios的都知道ios上输入法关闭的同时会自动关闭输入框,那么在android上如何实现监听输入法弹出和关闭呢?本篇文章就为你提供了一种可靠的实现方式. 演示效果视频地址 首先在AndroidManifest中配置 android:windowSoftInputMode="adjustResize" 这样每次输入法弹出和关闭都会重新计算高度实现把布局顶上去的效果 然后我们要自定义一个布局,监听布局大小变化 public class CheckSoftInputLayout exten

  • Android屏幕锁屏弹窗的正确姿势DEMO详解

    在上篇文章给大家介绍了Android程序开发仿新版QQ锁屏下弹窗功能.今天通过本文给大家分享android锁屏弹窗的正确姿势. 最近在做一个关于屏幕锁屏悬浮窗的功能,于是在网上搜索了很多安卓屏幕锁屏的相关资料,鉴于网上的资料比较零碎,所以我在这里进行整理总结.本文将从以下两点对屏幕锁屏进行解析: 1. 如何监听系统屏幕锁屏 2. 如何在锁屏界面弹出悬浮窗 如何监听系统屏幕锁屏 经过总结,监听系统的锁屏可以通过以下两种方式: 1) 代码直接判定 2) 接收广播 1) 代码直接判定 代码判断方式,也

  • Android实现气泡布局/弹窗效果 气泡尖角方向及偏移量可控

    Android 自定义布局实现气泡弹窗,可控制气泡尖角方向及偏移量. 效果图 实现 首先自定义一个气泡布局. /** * 气泡布局 */ public class BubbleRelativeLayout extends RelativeLayout { /** * 气泡尖角方向 */ public enum BubbleLegOrientation { TOP, LEFT, RIGHT, BOTTOM, NONE } public static int PADDING = 30; public

随机推荐