Android Expandable text view with "View More" Button displaying at center after 3 lines
This is how i have achieved the desired output,
MytextView which i want to expand is: tvDescription I have a see more button with name: btnSeeMore
To check if the textview has more than 4 lines i had a listener for it as follows,
tvDescription.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
if(expandable) {
expandable = false;
if (tvDescription.getLineCount() > 4) {
btnSeeMore.setVisibility(View.VISIBLE);
ObjectAnimator animation = ObjectAnimator.ofInt(tvDescription, "maxLines", 4);
animation.setDuration(0).start();
}
}
}
});
I have kept a boolean value to check if textview is already expanded so that there will not be any hickups while collapsing it.
if textview has more than four lines, boolean flag will be true and the button will be visible so this is the code for expanding and collapsing animation.
btnSeeMore.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
if (!expand) {
expand = true;
ObjectAnimator animation = ObjectAnimator.ofInt(tvDescription, "maxLines", 40);
animation.setDuration(100).start();
btnSeeMore.setImageDrawable(ContextCompat.getDrawable(getActivity(), R.drawable.ic_collapse));
} else {
expand = false;
ObjectAnimator animation = ObjectAnimator.ofInt(tvDescription, "maxLines", 4);
animation.setDuration(100).start();
btnSeeMore.setImageDrawable(ContextCompat.getDrawable(getActivity(),R.drawable.ic_expand));
}
}
});
Comment below for further information
Easy and Simple way to achieve this is.
sample.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/tvSongDes"
android:layout_marginStart="@dimen/dimen16"
android:layout_marginEnd="@dimen/dimen16"
android:layout_marginTop="@dimen/dimen16"
android:maxLines="3"
android:text="Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy Dummy dummy "
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<Button
android:id="@+id/btShowmore"
android:layout_width="wrap_content"
android:layout_marginStart="@dimen/dimen16"
android:text="Showmore..."
android:textAllCaps="false"
android:textColor="@android:color/holo_blue_light"
android:background="@android:color/transparent"
android:layout_height="wrap_content" />
</LinearLayout>
and inside your Activity onCreate..
TextView tvSongDes;
Button btShowmore;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_devotional_songs_play);
tvSongDes=(TextView)findViewById(R.id.tvSongDes);
btShowmore=(Button)findViewById(R.id.btShowmore);
btShowmore.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (btShowmore.getText().toString().equalsIgnoreCase("Showmore..."))
{
tvSongDes.setMaxLines(Integer.MAX_VALUE);//your TextView
btShowmore.setText("Showless");
}
else
{
tvSongDes.setMaxLines(3);//your TextView
btShowmore.setText("Showmore...");
}
}
});
}
Hoping it will be helpfull for someone.