Android 用动画展开 ListView 项目

Question

提问by Manjunath

I have a ListView. Initially, the ListViewcontains some data. When the user clicks on an item, another layout will be dynamically added to that item so it's height will be increased.

我有一个ListView. 最初，ListView包含一些数据。当用户单击一个项目时，另一个布局将动态添加到该项目，因此它的高度将增加。

Right now, when the item's height is increased, it shows the modified item instantly. However, what I want is for this to be animated so it increases the item's height gradually.

现在，当项目的高度增加时，它会立即显示修改后的项目。但是，我想要的是将其设置为动画，以便逐渐增加项目的高度。

Answer 1

采纳答案by David

I think I was looking for the same as was asked, I was looking for a way to animate the expanding of the listview item as some new content is shown (I was just changing the visibility on some views from GONEto VISIBLE). I had used the answer by mirroredAbstractionto help me apply a translate animation (I didn't want a rotate animation):

我想我正在寻找与被问到的相同的方法，我正在寻找一种方法来在显示一些新内容时为列表视图项的扩展设置动画（我只是将某些视图的可见性从更改GONE为VISIBLE）。我已经使用答案mirroredAbstraction来帮助我应用翻译动画（我不想要旋转动画）：

<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator"
android:fromYDelta="0"
android:toYDelta="-100%p"
android:duration="500"   
/>

to each of the views. It create a nice effect, but looking closely, the listview item was actually suddenly expanding to the entire size that would be needed, then the animation dropped the views into place. But what I wanted was the effect of the listview item growing down as the views come into visibility.

每个视图。它创建了一个很好的效果，但仔细观察，列表视图项实际上突然扩展到所需的整个大小，然后动画将视图放置到位。但我想要的是随着视图变得可见，列表视图项会逐渐减小的效果。

I found exactly what I was looking for here: expanding-listview-items

我在这里找到了我想要的东西：扩展列表视图项目

The blogger has a link to his github sample, here: ExpandAnimationExample

博主有他的 github 示例链接，这里是： ExpandAnimationExample

If you find these sites gone, please inform me and I will make my copy available.

如果你发现这些网站不见了，请通知我，我会提供我的副本。

he put a negative margin on the content to come into visibility as well as setting visibility to GONE:

他在内容上设置了负边距以使其可见，并将可见性设置为GONE：

android:layout_marginBottom="-50dip"

and wrote an animation manipulating the bottom margin:

并编写了一个操作底部边距的动画：

public class ExpandAnimation extends Animation {
...
    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        super.applyTransformation(interpolatedTime, t);

        if (interpolatedTime < 1.0f) {

            // Calculating the new bottom margin, and setting it
            mViewLayoutParams.bottomMargin = mMarginStart
                    + (int) ((mMarginEnd - mMarginStart) * interpolatedTime);

            // Invalidating the layout, making us seeing the changes we made
            mAnimatedView.requestLayout();
        }
        ...
    }
}

and it looks very nice. I found his answer to this SO (possible duplicate?) question:

它看起来很漂亮。我找到了他对这个 SO（可能重复？）问题的回答：

Adding animation to a ListView in order to expand/collapse content

向 ListView 添加动画以展开/折叠内容

Also, please let me know if you know another way to do the same thing.

另外，如果您知道做同样事情的另一种方法，请告诉我。

Answer 2

回答by Leonardo Cardoso

I've implemented a simple code that works in all Android's sdk versions.

我已经实现了一个适用于所有 Android sdk 版本的简单代码。

See below its working and the code.

请参阅下面的工作和代码。

Github code: https://github.com/LeonardoCardoso/Animated-Expanding-ListView

Github 代码：https: //github.com/LeonardoCardoso/Animated-Expanding-ListView

For information on my website: http://android.leocardz.com/animated-expanding-listview/

有关我的网站的信息：http: //android.leocardz.com/animated-expanding-listview/

normal accordion

普通的手风琴

Basically, you have to create a custom TranslateAnimation and a Custom List Adapter and, while it's animating, you have to update the current height of listview item and notify the adapter about this change.

基本上，您必须创建一个自定义 TranslateAnimation 和一个自定义列表适配器，并且在进行动画处理时，您必须更新列表视图项的当前高度并将此更改通知适配器。

Let's go to the code.

让我们来看看代码。

List Item layout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:id="@+id/text_wrap"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:orientation="horizontal"
       android:paddingBottom="@dimen/activity_vertical_margin"
       android:paddingLeft="@dimen/activity_horizontal_margin"
       android:paddingRight="@dimen/activity_horizontal_margin"
       android:paddingTop="@dimen/activity_vertical_margin" >

       <TextView
           android:id="@+id/text"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:textSize="18sp" >
       </TextView>

</LinearLayout>

Activity Layout

   <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
          xmlns:tools="http://schemas.android.com/tools"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          tools:context=".MainActivity" >

          <ListView
              android:id="@+id/list"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:divider="@android:color/black"
              android:dividerHeight="3dp" >
          </ListView>

      </RelativeLayout>

List Item class

public class ListItem {

private String text;
private int collapsedHeight, currentHeight, expandedHeight;
private boolean isOpen;
private ListViewHolder holder;
private int drawable;

public ListItem(String text, int collapsedHeight, int currentHeight,
        int expandedHeight) {
    super();
    this.text = text;
    this.collapsedHeight = collapsedHeight;
    this.currentHeight = currentHeight;
    this.expandedHeight = expandedHeight;
    this.isOpen = false;
    this.drawable = R.drawable.down;
}

public String getText() {
    return text;
}

public void setText(String text) {
    this.text = text;
}

public int getCollapsedHeight() {
    return collapsedHeight;
}

public void setCollapsedHeight(int collapsedHeight) {
    this.collapsedHeight = collapsedHeight;
}

public int getCurrentHeight() {
    return currentHeight;
}

public void setCurrentHeight(int currentHeight) {
    this.currentHeight = currentHeight;
}

public int getExpandedHeight() {
    return expandedHeight;
}

public void setExpandedHeight(int expandedHeight) {
    this.expandedHeight = expandedHeight;
}

public boolean isOpen() {
    return isOpen;
}

public void setOpen(boolean isOpen) {
    this.isOpen = isOpen;
}

public ListViewHolder getHolder() {
    return holder;
}

public void setHolder(ListViewHolder holder) {
    this.holder = holder;
}

public int getDrawable() {
    return drawable;
}

public void setDrawable(int drawable) {
    this.drawable = drawable;
}
}

View Holder class

public class ListViewHolder {
 private LinearLayout textViewWrap;
 private TextView textView;

 public ListViewHolder(LinearLayout textViewWrap, TextView textView) {
    super();
    this.textViewWrap = textViewWrap;
    this.textView = textView;
 }

 public TextView getTextView() {
        return textView;
 }

 public void setTextView(TextView textView) {
    this.textView = textView;
 }

 public LinearLayout getTextViewWrap() {
    return textViewWrap;
 }

 public void setTextViewWrap(LinearLayout textViewWrap) {
    this.textViewWrap = textViewWrap;
 }
}

Custom Animation class

    public class ResizeAnimation extends Animation {
    private View mView;
    private float mToHeight;
    private float mFromHeight;

    private float mToWidth;
    private float mFromWidth;

    private ListAdapter mListAdapter;
    private ListItem mListItem;

    public ResizeAnimation(ListAdapter listAdapter, ListItem listItem,
            float fromWidth, float fromHeight, float toWidth, float toHeight) {
        mToHeight = toHeight;
        mToWidth = toWidth;
        mFromHeight = fromHeight;
        mFromWidth = fromWidth;
        mView = listItem.getHolder().getTextViewWrap();
        mListAdapter = listAdapter;
        mListItem = listItem;
        setDuration(200);
    }

    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        float height = (mToHeight - mFromHeight) * interpolatedTime
                + mFromHeight;
        float width = (mToWidth - mFromWidth) * interpolatedTime + mFromWidth;
        LayoutParams p = (LayoutParams) mView.getLayoutParams();
        p.height = (int) height;
        p.width = (int) width;
        mListItem.setCurrentHeight(p.height);
        mListAdapter.notifyDataSetChanged();
    }
  }

Custom List Adapter class

public class ListAdapter extends ArrayAdapter<ListItem> {
private ArrayList<ListItem> listItems;
private Context context;

public ListAdapter(Context context, int textViewResourceId,
    ArrayList<ListItem> listItems) {
super(context, textViewResourceId, listItems);
this.listItems = listItems;
this.context = context;
}

@Override
@SuppressWarnings("deprecation")
public View getView(int position, View convertView, ViewGroup parent) {
ListViewHolder holder = null;
ListItem listItem = listItems.get(position);

if (convertView == null) {
    LayoutInflater vi = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    convertView = vi.inflate(R.layout.list_item, null);

    LinearLayout textViewWrap = (LinearLayout) convertView
            .findViewById(R.id.text_wrap);
    TextView text = (TextView) convertView.findViewById(R.id.text);

    holder = new ListViewHolder(textViewWrap, text);
} else
    holder = (ListViewHolder) convertView.getTag();

holder.getTextView().setText(listItem.getText());

LayoutParams layoutParams = new LayoutParams(LayoutParams.FILL_PARENT,
        listItem.getCurrentHeight());
holder.getTextViewWrap().setLayoutParams(layoutParams);

holder.getTextView().setCompoundDrawablesWithIntrinsicBounds(
        listItem.getDrawable(), 0, 0, 0);

convertView.setTag(holder);

listItem.setHolder(holder);

return convertView;
}

}

Main Activity

public class MainActivity extends Activity {

private ListView listView;
private ArrayList<ListItem> listItems;
private ListAdapter adapter;

private final int COLLAPSED_HEIGHT_1 = 150, COLLAPSED_HEIGHT_2 = 200,
    COLLAPSED_HEIGHT_3 = 250;

private final int EXPANDED_HEIGHT_1 = 250, EXPANDED_HEIGHT_2 = 300,
    EXPANDED_HEIGHT_3 = 350, EXPANDED_HEIGHT_4 = 400;

private boolean accordion = true;

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

listView = (ListView) findViewById(R.id.list);

listItems = new ArrayList<ListItem>();
mockItems();

adapter = new ListAdapter(this, R.layout.list_item, listItems);

listView.setAdapter(adapter);

listView.setOnItemClickListener(new OnItemClickListener() {

    @Override
    public void onItemClick(AdapterView<?> parent, View view,
            int position, long id) {
        toggle(view, position);
    }
});
}

private void toggle(View view, final int position) {
ListItem listItem = listItems.get(position);
listItem.getHolder().setTextViewWrap((LinearLayout) view);

int fromHeight = 0;
int toHeight = 0;

if (listItem.isOpen()) {
    fromHeight = listItem.getExpandedHeight();
    toHeight = listItem.getCollapsedHeight();
} else {
    fromHeight = listItem.getCollapsedHeight();
    toHeight = listItem.getExpandedHeight();

    // This closes all item before the selected one opens
    if (accordion) {
        closeAll();
    }
}

toggleAnimation(listItem, position, fromHeight, toHeight, true);
}

private void closeAll() {
int i = 0;
for (ListItem listItem : listItems) {
    if (listItem.isOpen()) {
        toggleAnimation(listItem, i, listItem.getExpandedHeight(),
                listItem.getCollapsedHeight(), false);
    }
    i++;
}
}

private void toggleAnimation(final ListItem listItem, final int position,
    final int fromHeight, final int toHeight, final boolean goToItem) {

ResizeAnimation resizeAnimation = new ResizeAnimation(adapter,
        listItem, 0, fromHeight, 0, toHeight);
resizeAnimation.setAnimationListener(new AnimationListener() {

    @Override
    public void onAnimationStart(Animation animation) {
    }

    @Override
    public void onAnimationRepeat(Animation animation) {
    }

    @Override
    public void onAnimationEnd(Animation animation) {
        listItem.setOpen(!listItem.isOpen());
        listItem.setDrawable(listItem.isOpen() ? R.drawable.up
                : R.drawable.down);
        listItem.setCurrentHeight(toHeight);
        adapter.notifyDataSetChanged();

        if (goToItem)
            goToItem(position);
    }
});

listItem.getHolder().getTextViewWrap().startAnimation(resizeAnimation);
}

private void goToItem(final int position) {
listView.post(new Runnable() {
    @Override
    public void run() {
        try {
            listView.smoothScrollToPosition(position);
        } catch (Exception e) {
            listView.setSelection(position);
        }
    }
});
}

private void mockItems() {
listItems
        .add(new ListItem(
                "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
                COLLAPSED_HEIGHT_1, COLLAPSED_HEIGHT_1,
                EXPANDED_HEIGHT_1));

listItems
        .add(new ListItem(
                "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
                COLLAPSED_HEIGHT_2, COLLAPSED_HEIGHT_2,
                EXPANDED_HEIGHT_2));

listItems
        .add(new ListItem(
                "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
                COLLAPSED_HEIGHT_3, COLLAPSED_HEIGHT_3,
                EXPANDED_HEIGHT_3));

listItems
        .add(new ListItem(
                "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.",
                COLLAPSED_HEIGHT_2, COLLAPSED_HEIGHT_2,
                EXPANDED_HEIGHT_4));

listItems
        .add(new ListItem(
                "At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.",
                COLLAPSED_HEIGHT_1, COLLAPSED_HEIGHT_1,
                EXPANDED_HEIGHT_4));

listItems
        .add(new ListItem(
                "Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.",
                COLLAPSED_HEIGHT_2, COLLAPSED_HEIGHT_2,
                EXPANDED_HEIGHT_4));

listItems
        .add(new ListItem(
                "Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae.",
                COLLAPSED_HEIGHT_3, COLLAPSED_HEIGHT_3,
                EXPANDED_HEIGHT_3));

listItems
        .add(new ListItem(
                "Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.",
                COLLAPSED_HEIGHT_1, COLLAPSED_HEIGHT_1,
                EXPANDED_HEIGHT_4));

    }

}

列表项布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:id="@+id/text_wrap"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:orientation="horizontal"
       android:paddingBottom="@dimen/activity_vertical_margin"
       android:paddingLeft="@dimen/activity_horizontal_margin"
       android:paddingRight="@dimen/activity_horizontal_margin"
       android:paddingTop="@dimen/activity_vertical_margin" >

       <TextView
           android:id="@+id/text"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:textSize="18sp" >
       </TextView>

</LinearLayout>

活动布局

   <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
          xmlns:tools="http://schemas.android.com/tools"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          tools:context=".MainActivity" >

          <ListView
              android:id="@+id/list"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:divider="@android:color/black"
              android:dividerHeight="3dp" >
          </ListView>

      </RelativeLayout>

列表项类

public class ListItem {

private String text;
private int collapsedHeight, currentHeight, expandedHeight;
private boolean isOpen;
private ListViewHolder holder;
private int drawable;

public ListItem(String text, int collapsedHeight, int currentHeight,
        int expandedHeight) {
    super();
    this.text = text;
    this.collapsedHeight = collapsedHeight;
    this.currentHeight = currentHeight;
    this.expandedHeight = expandedHeight;
    this.isOpen = false;
    this.drawable = R.drawable.down;
}

public String getText() {
    return text;
}

public void setText(String text) {
    this.text = text;
}

public int getCollapsedHeight() {
    return collapsedHeight;
}

public void setCollapsedHeight(int collapsedHeight) {
    this.collapsedHeight = collapsedHeight;
}

public int getCurrentHeight() {
    return currentHeight;
}

public void setCurrentHeight(int currentHeight) {
    this.currentHeight = currentHeight;
}

public int getExpandedHeight() {
    return expandedHeight;
}

public void setExpandedHeight(int expandedHeight) {
    this.expandedHeight = expandedHeight;
}

public boolean isOpen() {
    return isOpen;
}

public void setOpen(boolean isOpen) {
    this.isOpen = isOpen;
}

public ListViewHolder getHolder() {
    return holder;
}

public void setHolder(ListViewHolder holder) {
    this.holder = holder;
}

public int getDrawable() {
    return drawable;
}

public void setDrawable(int drawable) {
    this.drawable = drawable;
}
}

查看持有人类

public class ListViewHolder {
 private LinearLayout textViewWrap;
 private TextView textView;

 public ListViewHolder(LinearLayout textViewWrap, TextView textView) {
    super();
    this.textViewWrap = textViewWrap;
    this.textView = textView;
 }

 public TextView getTextView() {
        return textView;
 }

 public void setTextView(TextView textView) {
    this.textView = textView;
 }

 public LinearLayout getTextViewWrap() {
    return textViewWrap;
 }

 public void setTextViewWrap(LinearLayout textViewWrap) {
    this.textViewWrap = textViewWrap;
 }
}

自定义动画类

    public class ResizeAnimation extends Animation {
    private View mView;
    private float mToHeight;
    private float mFromHeight;

    private float mToWidth;
    private float mFromWidth;

    private ListAdapter mListAdapter;
    private ListItem mListItem;

    public ResizeAnimation(ListAdapter listAdapter, ListItem listItem,
            float fromWidth, float fromHeight, float toWidth, float toHeight) {
        mToHeight = toHeight;
        mToWidth = toWidth;
        mFromHeight = fromHeight;
        mFromWidth = fromWidth;
        mView = listItem.getHolder().getTextViewWrap();
        mListAdapter = listAdapter;
        mListItem = listItem;
        setDuration(200);
    }

    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        float height = (mToHeight - mFromHeight) * interpolatedTime
                + mFromHeight;
        float width = (mToWidth - mFromWidth) * interpolatedTime + mFromWidth;
        LayoutParams p = (LayoutParams) mView.getLayoutParams();
        p.height = (int) height;
        p.width = (int) width;
        mListItem.setCurrentHeight(p.height);
        mListAdapter.notifyDataSetChanged();
    }
  }

自定义列表适配器类

public class ListAdapter extends ArrayAdapter<ListItem> {
private ArrayList<ListItem> listItems;
private Context context;

public ListAdapter(Context context, int textViewResourceId,
    ArrayList<ListItem> listItems) {
super(context, textViewResourceId, listItems);
this.listItems = listItems;
this.context = context;
}

@Override
@SuppressWarnings("deprecation")
public View getView(int position, View convertView, ViewGroup parent) {
ListViewHolder holder = null;
ListItem listItem = listItems.get(position);

if (convertView == null) {
    LayoutInflater vi = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    convertView = vi.inflate(R.layout.list_item, null);

    LinearLayout textViewWrap = (LinearLayout) convertView
            .findViewById(R.id.text_wrap);
    TextView text = (TextView) convertView.findViewById(R.id.text);

    holder = new ListViewHolder(textViewWrap, text);
} else
    holder = (ListViewHolder) convertView.getTag();

holder.getTextView().setText(listItem.getText());

LayoutParams layoutParams = new LayoutParams(LayoutParams.FILL_PARENT,
        listItem.getCurrentHeight());
holder.getTextViewWrap().setLayoutParams(layoutParams);

holder.getTextView().setCompoundDrawablesWithIntrinsicBounds(
        listItem.getDrawable(), 0, 0, 0);

convertView.setTag(holder);

listItem.setHolder(holder);

return convertView;
}

}

主要活动

public class MainActivity extends Activity {

private ListView listView;
private ArrayList<ListItem> listItems;
private ListAdapter adapter;

private final int COLLAPSED_HEIGHT_1 = 150, COLLAPSED_HEIGHT_2 = 200,
    COLLAPSED_HEIGHT_3 = 250;

private final int EXPANDED_HEIGHT_1 = 250, EXPANDED_HEIGHT_2 = 300,
    EXPANDED_HEIGHT_3 = 350, EXPANDED_HEIGHT_4 = 400;

private boolean accordion = true;

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

listView = (ListView) findViewById(R.id.list);

listItems = new ArrayList<ListItem>();
mockItems();

adapter = new ListAdapter(this, R.layout.list_item, listItems);

listView.setAdapter(adapter);

listView.setOnItemClickListener(new OnItemClickListener() {

    @Override
    public void onItemClick(AdapterView<?> parent, View view,
            int position, long id) {
        toggle(view, position);
    }
});
}

private void toggle(View view, final int position) {
ListItem listItem = listItems.get(position);
listItem.getHolder().setTextViewWrap((LinearLayout) view);

int fromHeight = 0;
int toHeight = 0;

if (listItem.isOpen()) {
    fromHeight = listItem.getExpandedHeight();
    toHeight = listItem.getCollapsedHeight();
} else {
    fromHeight = listItem.getCollapsedHeight();
    toHeight = listItem.getExpandedHeight();

    // This closes all item before the selected one opens
    if (accordion) {
        closeAll();
    }
}

toggleAnimation(listItem, position, fromHeight, toHeight, true);
}

private void closeAll() {
int i = 0;
for (ListItem listItem : listItems) {
    if (listItem.isOpen()) {
        toggleAnimation(listItem, i, listItem.getExpandedHeight(),
                listItem.getCollapsedHeight(), false);
    }
    i++;
}
}

private void toggleAnimation(final ListItem listItem, final int position,
    final int fromHeight, final int toHeight, final boolean goToItem) {

ResizeAnimation resizeAnimation = new ResizeAnimation(adapter,
        listItem, 0, fromHeight, 0, toHeight);
resizeAnimation.setAnimationListener(new AnimationListener() {

    @Override
    public void onAnimationStart(Animation animation) {
    }

    @Override
    public void onAnimationRepeat(Animation animation) {
    }

    @Override
    public void onAnimationEnd(Animation animation) {
        listItem.setOpen(!listItem.isOpen());
        listItem.setDrawable(listItem.isOpen() ? R.drawable.up
                : R.drawable.down);
        listItem.setCurrentHeight(toHeight);
        adapter.notifyDataSetChanged();

        if (goToItem)
            goToItem(position);
    }
});

listItem.getHolder().getTextViewWrap().startAnimation(resizeAnimation);
}

private void goToItem(final int position) {
listView.post(new Runnable() {
    @Override
    public void run() {
        try {
            listView.smoothScrollToPosition(position);
        } catch (Exception e) {
            listView.setSelection(position);
        }
    }
});
}

private void mockItems() {
listItems
        .add(new ListItem(
                "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
                COLLAPSED_HEIGHT_1, COLLAPSED_HEIGHT_1,
                EXPANDED_HEIGHT_1));

listItems
        .add(new ListItem(
                "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
                COLLAPSED_HEIGHT_2, COLLAPSED_HEIGHT_2,
                EXPANDED_HEIGHT_2));

listItems
        .add(new ListItem(
                "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
                COLLAPSED_HEIGHT_3, COLLAPSED_HEIGHT_3,
                EXPANDED_HEIGHT_3));

listItems
        .add(new ListItem(
                "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.",
                COLLAPSED_HEIGHT_2, COLLAPSED_HEIGHT_2,
                EXPANDED_HEIGHT_4));

listItems
        .add(new ListItem(
                "At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.",
                COLLAPSED_HEIGHT_1, COLLAPSED_HEIGHT_1,
                EXPANDED_HEIGHT_4));

listItems
        .add(new ListItem(
                "Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.",
                COLLAPSED_HEIGHT_2, COLLAPSED_HEIGHT_2,
                EXPANDED_HEIGHT_4));

listItems
        .add(new ListItem(
                "Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae.",
                COLLAPSED_HEIGHT_3, COLLAPSED_HEIGHT_3,
                EXPANDED_HEIGHT_3));

listItems
        .add(new ListItem(
                "Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.",
                COLLAPSED_HEIGHT_1, COLLAPSED_HEIGHT_1,
                EXPANDED_HEIGHT_4));

    }

}

Answer 3

回答by Deepscorn

Using value animator the solution looks nice:

使用 value animator 解决方案看起来不错：

ValueAnimator animator = ValueAnimator.ofInt(100, 300);
animator.setDuration(1000);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
  @Override
  public void onAnimationUpdate(ValueAnimator animation) {
    listViewItem.getLayoutParams().height = (Integer) animation.getAnimatedValue();
    listViewItem.requestLayout();
  }
});
animator.start();

Just read the android developer guide, it is worth reading: http://developer.android.com/guide/topics/graphics/prop-animation.html

刚刚阅读了android开发者指南，值得一读：http: //developer.android.com/guide/topics/graphics/prop-animation.html

But keep in mind, that requestLayout() processing is heavy. Because one call of requestLayout() make every nearby element, which is visually affected, recalculate it's layout. It may be better to use negative bottom margin (to hide some part of your element under another one) and use the following to show it:

但请记住， requestLayout() 处理很繁重。因为对 requestLayout() 的一次调用会使视觉上受到影响的每个附近元素重新计算其布局。最好使用负底边距（将元素的某些部分隐藏在另一个元素下）并使用以下内容来显示它：

listViewItem.setTranslationY((Integer) animation.getAnimatedValue());

Of course, you may animate only bottom margin, like proposed in another answer to this question.

当然，您可以只对底部边距进行动画处理，就像在这个问题的另一个答案中提出的那样。

Answer 4

回答by Arif Nadeem

You will have to implement Animation in Adapterof you ListViewto achieve what you want,

你将不得不在Adapter你体内实现动画ListView来实现你想要的，

Firstly create a basic animation.xmlfile, create a folder named anim in res folder and then put your animation.xml file in it.

首先创建一个基本animation.xml文件，在 res 文件夹中创建一个名为 anim 的文件夹，然后将您的 animation.xml 文件放入其中。

For e.g. I have created a sample animation named rotate_animation.xml

例如，我创建了一个名为 rotate_animation.xml 的示例动画

<?xml version="1.0" encoding="UTF-8"?>
<rotate
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:toDegrees="360"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="400" />

Then create an instance of AnimationObjectlike this

然后创建的实例，AnimationObject这样

private Animation animation;

Then in getView method of your Adapter implementation do something like this

然后在你的 Adapter 实现的 getView 方法中做这样的事情

public View getView(int position, View convertView, ViewGroup parent) {
        View v = convertView;
        ViewHolder viewHolder;
        if (convertView == null) {
            LayoutInflater li = (LayoutInflater) mContext
                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = li.inflate(R.layout.my_layout, null);
            viewHolder = new ViewHolder(v);
            v.setTag(viewHolder);

        } else {
            viewHolder = (ViewHolder) v.getTag();
        }

        viewHolder.mAppName.setText("SomeText");
        viewHolder.mAppImage.setImageDrawable(R.drawable.someImage);
        animation = AnimationUtils.loadAnimation(mContext, R.anim.my_animation);
        v.startAnimation(animation);
        return v;
    }

Answer 5

回答by user7023213

My use case is just to have more or less text displayed. So to toggle state of a listview item from 2-6 max lines for instance one can do this. And its also animated. Animation dont look exactly smooth but...

我的用例只是显示更多或更少的文本。因此，例如要从 2-6 行最大行切换列表视图项的状态，可以这样做。它也是动画的。动画看起来并不完全流畅，但...

                            if(!textDescriptionLenghtToggle) { // simple boolean toggle
                                ObjectAnimator animation = ObjectAnimator.ofInt(
                                        textViewContainingDescription,
                                        "maxLines",
                                        6);
                                animation.setDuration(300);
                                animation.start();
                            } else {
                                ObjectAnimator animation = ObjectAnimator.ofInt(
                                        textViewContainingDescription,
                                        "maxLines",
                                        2);
                                animation.setDuration(300);
                                animation.start();
                            }

Android 用动画展开 ListView 项目

提问by Manjunath

采纳答案by David

回答by Leonardo Cardoso

回答by Deepscorn

回答by Arif Nadeem

回答by user7023213

相关推荐

最近更新

标签

Android 用动画展开 ListView 项目

提问by Manjunath

采纳答案by David

回答by Leonardo Cardoso

回答by Deepscorn

回答by Arif Nadeem

回答by user7023213

相关推荐

Android：屏幕上的浮动可点击图标？

Android - “解析 android-21 的数据失败”

适用于 KitKat 的 Android 5.0 Material Design 风格导航抽屉

Android onClick 方法

相关推荐

最近更新

标签