博主前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住也分享一下给大家,
👉点击跳转到网站
先看效果图:
步骤一:
创建ExpandTabTextView类拓展TextView 和 text_expand.xml
具体详解已经在代码中详细的注释了出来
public class ExpandTabTextView extends LinearLayout implements View.OnClickListener {
//声明上下文对象
private Context context;
//声明文本视图对象
private TextView text_view;
//声明按钮对象
private Button btn;
//正常显示的行数
private int line_number = 3;
//是否被选中
private boolean isSelect = false;
public ExpandTabTextView(Context context) {
super(context);
}
public ExpandTabTextView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
this.context = context;
//从布局文件中获取展示内容
LayoutInflater.from(context).inflate(R.layout.text_expand, this, true);
}
//在布局展示完毕后调用,因为getLineHeight方法(获取TextView的行高)要等渲染完成后才能得知具体高度
//行高是指一行文字上方距离下一行文字上方的距离。
@Override
protected void onFinishInflate() {
super.onFinishInflate();
//从布局文件中获取名叫ll_content的线性布局
LinearLayout ll_content = findViewById(R.id.ll_content);
//设置布局的点击事件
btn=findViewById(R.id.btn);
btn.setText("查看更多");
btn.setOnClickListener(this);
//从布局文件中获取text_view的文本视图
text_view = findViewById(R.id.text_view);
//设置文本的高度为n行文字这么高
/*TextView的首行和最后一行有一个额外的padding间距,
这导致实际行高要大于getLineHeight()方法得到的行高
所以在设置文本高度时:(普通行高+6)*行数
*/
text_view.setHeight((text_view.getLineHeight() + 6) * line_number);
}
//设置文本内容
public void setText(String content) {
text_view.setText(content);
}
//设置文本的资源编号
public void setText(int id) {
setText(context.getResources().getString(id));
}
@Override
public void onClick(View v) {
if (v.getId() == R.id.btn) {
isSelect = !isSelect;
//清除文本视图的动画
text_view.clearAnimation();
final int deltaValue;
//获得文本视图的实际高度
final int startValue = text_view.getHeight();
if (isSelect) {//如果选中则展开后面的所有文字 getLineCount():获取TextView文字行数
//结果为新增的文本视图的高度
deltaValue = (text_view.getLineHeight() + 6) * text_view.getLineCount() - startValue;
btn.setText("隐藏更多");
} else {
//结果为0
deltaValue = (text_view.getLineHeight() + 6) * line_number - startValue;
btn.setText("查看更多");
}
//创建一个文字展开 收缩动画
Animation animation = new Animation() {
//该方法就是动画的具体实现
/*
第一个参数:interpolatedTime代表动画的时间进行比。
不管动画实际的持续时间如何,当动画播放时,该参数总是自动从0变化到1
第二个参数:Transformation t代表了补间动画在不同时刻对图形或组件的变形程度。
*/
@Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
//随着时间的流逝重新设置文本的行高
text_view.setHeight((int) (startValue + deltaValue * interpolatedTime));
}
};
//设置动画的持续时间为500毫秒
animation.setDuration(500);
//开始文本视图的动画展示
text_view.startAnimation(animation);
}
}
}
text_expand.xml 布局代码如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@+id/ll_content"
>
<TextView
android:id="@+id/text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="@color/black"
android:textSize="20sp" />
<Button
android:id="@+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="查看更多"
/>
</LinearLayout>
到这一步基本上已经大功告成了,把这个拓展的ExpandTabTextView在布局中使用即可。
步骤二:创建main.xml 使用ExpandTabTextView
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.example.expand.view.ExpandTabTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/expand"
/>
</LinearLayout>
创建MainActivity获取拓展TextView的实例,并且通过代码传入文本内容:
public class MainActivity extends AppCompatActivity {
private ExpandTabTextView expand;
//文本内容写在了values目录下的strings.xml中
private int[] newsArray = {R.string.news1, R.string.news2, R.string.news3, R.string.news4};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
expand = findViewById(R.id.expand);
int seq = (int) (Math.random() * 100 % 4);
//设置展开布局的文本内容
expand.setText(newsArray[seq]);
}
}
以上就是实现展开与收缩文本功能的基本步骤,内容很简单,自己做下总结,也希望能帮助正好有此需求的人~ 有不当之处在评论区指正就行!