HarmongOS开发listContainer加载动画制作（实验性 意思并不稳定）

Posted 2021-07-23 码上夏雨

最近想给list添加动画，于是试着做了一下，我们先看效果

可以看到 item是从左进入屏幕的，但是并不稳定，我在这里说一下我的实现方式：

1.在Provider里面声明AnimatorProperty

private AnimatorProperty animatorProperty;

2.在getComponent方法里面设置属性动画

@Override
public Component getComponent(int position, Component convertComponent, ComponentContainer componentContainer) {
        final Component cpt;
        if (convertComponent == null) {
            cpt = LayoutScatter.getInstance(slice).parse(ResourceTable.Layout_item_text, null, false);
        } else {
            cpt = convertComponent;
        }
        animatorProperty = cpt.createAnimatorProperty();
        animatorProperty.moveFromX(-3000).moveToX(0).setDelay(100).setDuration(2000).setLoopedCount(0);
        SampleItem sampleItem = list.get(position);
        Text text = (Text) cpt.findComponentById(ResourceTable.Id_text);
        text.setText(sampleItem.getStr());
        return cpt;
}

3.同时在listContainer.addItemVisibilityChangedListener里面启动动画

listContainer.addItemVisibilityChangedListener(new ListContainer.ItemVisibilityChangedListener() {
            @Override
            public void onItemAdded(Component component, int i) {
                sampleItemProvider.getAnimatorProperty().start();
            }

            @Override
            public void onItemRemoved(Component component, int i) {
                sampleItemProvider.getAnimatorProperty().start();
            }
        });

这种方法效果并不好，只是提供一种思路，如果有更好的方案也欢迎大家评论交流