Android实现带动画效果的可点击展开TextView

本文为大家分享了Android实现带动画效果的可点击展开TextView 制作代码,效果图:

收起(默认)效果:

点击展开后的效果:

源码:

布局:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 android:id="@+id/activity_main"
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical"
 >

 <ScrollView
  android:id="@+id/sv"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  >

  <LinearLayout
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:background="#f6f6f6"
   android:orientation="vertical"
   android:padding="5dp">

   <TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"

    android:maxLines="1"
    android:text="简介"
    android:textColor="#000000"
    android:textSize="20sp"/>

   <TextView
    android:id="@+id/tv_des"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColor="#666666"
    android:textSize="18sp"/>

   <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dp"
    android:gravity="center_vertical"
    android:orientation="horizontal">

    <ImageView
     android:id="@+id/iv_des_arrow"
     android:layout_width="20dp"
     android:layout_height="20dp"
     android:layout_alignParentEnd="true"
     android:background="@mipmap/arrow_down"/>
   </RelativeLayout>

  </LinearLayout>

 </ScrollView>
</LinearLayout>

功能实现:

package com.cnfol.demo;

import android.animation.Animator;
import android.animation.ValueAnimator;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.widget.ImageView;
import android.widget.ScrollView;
import android.widget.TextView;

public class MainActivity extends Activity implements View.OnClickListener {

 private TextView tv_des;

 private ImageView iv_des_arrow;

 private boolean isExpandDes = false;//是否展开整个描述

 private int minHeight = 0;
 private int maxHeight = 0;

 private ScrollView scrollView;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);

  scrollView = (ScrollView) findViewById(R.id.sv);

  tv_des = (TextView) findViewById(R.id.tv_des);
  tv_des.setOnClickListener(this);

  iv_des_arrow = (ImageView) findViewById(R.id.iv_des_arrow);
  iv_des_arrow.setOnClickListener(this);

  String s = "中华人民共和国,简称中国,位于亚洲东部,太平洋西岸, 是工人阶级领导的、以工农联盟为基础的人民民主专政的社会主义国家。\n" +
    "\n" +
    "1949年(己丑年)10月1日成立, 以五星红旗为国旗, 《义勇军进行曲》为国歌, 国徽内容包括国旗、天安门、齿轮和麦稻穗, 首都北京, 省级行政区划为23个省、5个自治区、4个直辖市、2个特别行政区, 是一个以汉族为主体民族,由56个民族构成的统一多民族国家,汉族占总人口的91.51%。\n" +
    "\n" +
    "新中国成立后随即开展经济恢复与建设,1953年开始三大改造, 到1956年确立了社会主义制度,进入社会主义探索阶段。 文化大革命之后开始改革开放,逐步确立了中国特色社会主义制度。中国陆地面积约960万平方公里,大陆海岸线1.8万多千米,岛屿岸线1.4万多千米,内海和边海的水域面积约470多万平方千米。海域分布有大小岛屿7600多个,其中台湾岛最大,面积35798平方千米。同14国接壤,与8国海上相邻。中国是四大文明古国之一, 有着悠久的历史文化。是世界国土面积第三大的国家,世界第一大人口国家,与英、法、美、俄并为联合国安理会五大常任理事国。\n" +
    "\n" +
    "中国是世界第二大经济体,世界第一贸易大国,世界第一大外汇储备国, 世界第一大钢铁生产国和世界第一大农业国,世界第一大粮食总产量国以及世界上经济成长最快的国家之一。";
  tv_des.setText(s);
  tv_des.setMaxLines(3);

  tv_des.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
   @Override
   public void onGlobalLayout() {
    //一般用完之后,立即移除该监听
    tv_des.getViewTreeObserver().removeGlobalOnLayoutListener(this);
    minHeight = tv_des.getMeasuredHeight();//获取3行时候的高度

    tv_des.setMaxLines(Integer.MAX_VALUE);//会全部显示内容
    tv_des.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
     @Override
     public void onGlobalLayout() {
      //一般用完之后,立即移除该监听
      tv_des.getViewTreeObserver().removeGlobalOnLayoutListener(this);
      maxHeight = tv_des.getMeasuredHeight();//获取总高度

      if (minHeight == maxHeight) {
       //最大高度和最小高度一样。说明设置的默认显示行数,已经可以把所有数据全部显示
       iv_des_arrow.setVisibility(View.GONE);
      }

      tv_des.getLayoutParams().height = minHeight;
      tv_des.requestLayout();//让tv_des显示为3行的高度
     }
    });
   }
  });

 }

 @Override
 public void onClick(View v) {

  switch (v.getId()) {

   case R.id.tv_des:
   case R.id.iv_des_arrow:
    ValueAnimator desAnimator = null;
    if (isExpandDes) {
     desAnimator = ValueAnimator.ofInt(maxHeight, minHeight);
    } else {
     desAnimator = ValueAnimator.ofInt(minHeight, maxHeight);
    }
    desAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
     @Override
     public void onAnimationUpdate(ValueAnimator animator) {
      int currentHeight = (Integer) animator.getAnimatedValue();
      tv_des.getLayoutParams().height = currentHeight;
      tv_des.requestLayout();

      //只有展开动画的时候才需要内容向上滚动,收缩动画的时候是不需要滚动的
      if (!isExpandDes) {
       int scrollY = currentHeight - minHeight;
       scrollView.scrollBy(0, scrollY);
      }
     }
    });
    desAnimator.setDuration(300);
    desAnimator.addListener(new DesAnimListener());
    desAnimator.start();
    break;

  }

 }

 /**
  * 描述区域动画的监听
  *
  * @author Administrator
  */
 class DesAnimListener implements Animator.AnimatorListener {
  @Override
  public void onAnimationCancel(Animator arg0) {
  }

  @Override
  public void onAnimationEnd(Animator arg0) {
   isExpandDes = !isExpandDes;
   iv_des_arrow.setBackgroundResource(isExpandDes ? R.mipmap.arrow_up : R.mipmap.arrow_down);
  }

  @Override
  public void onAnimationRepeat(Animator arg0) {
  }

  @Override
  public void onAnimationStart(Animator arg0) {
  }
 }

}

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

(0)

相关推荐

  • Android TextView 去掉自适应默认的fontpadding的实现方法

    Android TextView 去掉自适应默认的fontpadding的实现方法 最近在项目中使用textview时发现在使用Android:layout_height="wrap_content"这个属性设置后,textview会有默认的padding,也就是fontpadding.这样就会造成textview和其他view中间的间距会比自己的设置的大.那么我们怎么来remove掉这个间距呢?  第一.先试试设置includefontpadding=false ,如果不能达到目的的

  • Android UI中TextView的使用方法

    Android UI中TextView的使用方法 一.TextView不同区域设置颜色,大小.点击事件 String msg = getResources().getString(R.string.school_roll_auth); SpannableStringBuilder style = new SpannableStringBuilder(msg); // 设置字体颜色 style.setSpan( new ForegroundColorSpan(getResources().getC

  • Android自定义TextView实现drawableLeft内容居中

    如何实现使用TextView的DrawableLeft使图片和文字居中显示呢??? 代码如下: 1.首先自定义一个类,继承TextView package com.test.signcalendar.weight; import android.content.Context; import android.graphics.Canvas; import android.graphics.drawable.Drawable; import android.util.AttributeSet; i

  • Android自定义textview实现竖直滚动跑马灯效果

    本文实例为大家分享了Android自定义textview实现跑马灯效果的具体代码,供大家参考,具体内容如下 xml布局 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.c

  • Android TextView对齐的两种方法

    Android TextView对齐的两种方法 在写Android布局文件时, 经常碰到如下图的TextView左右对齐的情况, 即姓名和手机号码纵向对齐.. 第一种方法:  在姓和名之间加空格, 但是如果用键盘的空格会在一些机型上对齐.一些机型上不对齐. \u3000是全角空格:  \u0020是半角空格,效果跟在英文输入法下直接敲键盘空格一样. 这里要用全角空格,  占位一个汉字. <TextView android:layout_width="wrap_content" a

  • Android中TextView显示圆圈背景或设置圆角的方法

    前言 在我们学习android这么久,而且使用TextView那么长时间,我们一直没有用过给TextView添加背景,或者是给TextView添加添加边框,以及怎么样设置TextView的形状.今天在写代码的时候就用到了,怎么在java代码部分设置TextView的背景,和TextView的形状及边框. 方法如下: 接下来我们来看一下,怎么在Java代码部分怎么设置TextView的背景颜色,其实很简单的就一句话. tvTemp.setBackgroundColor(Color.parseCol

  • Android为TextView添加字体库和设置描边的方法

    一.使用系统自带的字体 开发Android的人大多都知道,Android里面对字体的支持少得可怜,默认情况下,TextView 的 typeface 属性支持 sans.serif和monospace 这三种字体,如果在没有指定字体的情况下,系统会使用 sans 作为文本显示的字体.但这三种字体只支持英文,也就是说只要你显示的文字是中文,无论你选择这三种字体中的哪一种,显示效果都是一样的. 1.在XML文件中设置 <!-- 使用默认的sans字体--> <TextView android

  • Android实现带动画效果的可点击展开TextView

    本文为大家分享了Android实现带动画效果的可点击展开TextView 制作代码,效果图: 收起(默认)效果: 点击展开后的效果: 源码: 布局: <?xml version="1.0" encoding="utf-8"?> <LinearLayout android:id="@+id/activity_main" xmlns:android="http://schemas.android.com/apk/res/a

  • Android自定义带动画效果的圆形ProgressBar

    本文实例为大家分享了Android自定义带动画效果的圆形ProgressBar,供大家参考,具体内容如下 最近有个需求显示进度,尾部还要有一标示,像下边这样 使用自定义View的方式实现,代码如下,很简单注释的很清楚 文章最后我们拓展一下功能,实现一个带动画效果的进度条 package com.example.fwc.allexample.progressbar; import android.animation.ValueAnimator; import android.annotation.

  • iOS自带动画效果的实例代码

     1.普通动画: [UIView beginAnimations:nil context:nil]; [UIView setAnimationDuration:2]; frame.origin.x += 150; [img setFrame:frame]; [UIView commitAnimations]; 2.连续动画(一系列图像): NSArray *myImages = [NSArray arrayWithObjects: [UIImage imageNamed:@"myImage1.p

  • Jquery实现带动画效果的经典二级导航菜单

    导航菜单比较实用,当然还是选择经典的,代码最少的,效果最好的喽,各位童鞋请围观哦,废话不说, 效果图如下,欢迎评价: 看代码: 复制代码 代码如下: <!DOCTYPE html > <html> <head> <title>一款带动画效果的经典二级导航菜单Jquery特效</title> <meta name="author" content="Jquery" /> <meta name

  • jQuery实现返回顶部按钮和scroll滚动功能[带动画效果]

    jQuery脚本: <script type="text/javascript"> $(function() { var scrollDiv = document.createElement('div'); $(scrollDiv).attr('id', 'toTop').html('^ 返回顶部').appendTo('body'); $(window).scroll(function() { if ($(this).scrollTop() != 0) { $('#toT

  • jquery实现仿新浪微博带动画效果弹出层代码(可关闭、可拖动)

    本文实例讲述了jquery实现仿新浪微博带动画效果弹出层代码.分享给大家供大家参考.具体如下: 这是一款jquery实现带动画的弹出层,最开始是模拟新浪微博中的弹出层,后来引入了jQuery,又想了想,加入点动画效果不知怎么样,后来就写出了这么一个弹出的网页层效果,你点击按钮后就可以看到一个渐出的可关闭的弹出层,点击关闭后,当然也是渐渐的消失的,移动时根据鼠标位置计算控件左上角的绝对位置,松开鼠标后停止移动并恢复成不透明. 运行效果截图如下: 在线演示地址如下: http://demo.jb51

  • jquery带动画效果幻灯片特效代码

    本文实例讲述了jquery带动画效果幻灯片插件devrama.slider.分享给大家供大家参考.具体如下: jquery带动画效果幻灯片插件devrama.slider是一款可以在焦点图中嵌入html内容和文字动画效果,运行时可出现图文层叠显示效果,且图片下方伴有进度条效果. 运行效果图:                                 -------------------查看效果 下载源码------------------- 小提示:浏览器中如果不能正常运行,可以尝试切换

  • jQuery实现带动画效果的多级下拉菜单代码

    本文实例讲述了jQuery实现带动画效果的多级下拉菜单代码.分享给大家供大家参考.具体如下: 这是一款基于jQuery实现的多级下拉菜单,带动画效果,所有的元素以ul li ul li ul li的循环格式嵌套 如果没有下级分类 就用li a结束嵌套,代码内不用toggle()的原因是为了在收缩菜单的时候同时也将该菜单的下级菜单以后的所有元素都隐藏. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-animate-style-dow

  • jQuery基于ajax实现带动画效果无刷新柱状图投票代码

    本文实例讲述了jQuery基于ajax实现带动画效果无刷新柱状图投票代码.分享给大家供大家参考.具体如下: 这里介绍的jQuery ajax投票特效,带动画效果 类似进度条风格的柱状图,以你最喜欢的编程语言是哪一种为例来演示投票效果,以Ajax方式无刷新投票,每点击一次,横向的柱状图就会增长一节.如果在火狐或chrome下浏览,那些柱状图横条是圆角的,在IE8下则无此效果. 运行效果截图如下: 具体代码如下: <!DOCTYPE html> <html> <head>

  • jQuery实现带动画效果的二级下拉导航方法

    本文实例讲述了jQuery实现带动画效果的二级下拉导航方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/x

随机推荐