HarmonyOS鸿蒙Next中实现频道选择UI示例代码

介绍

该示例实现频道选择UI，通过Grid实现页面布局，实现长按拖动、删除等动画效果。

实现频道选择UI源码链接

图片名称

使用说明

进入应用，点击右上角的编辑按钮后，可以拖动item，并修改其顺序。可以点击图标右上角的删除按钮进行图标删除。

实现思路

点击按钮进行编辑完成状态切换。
拖动图标修改其顺序。
在编辑状态下点击删除按钮进行图标删除。

更多关于HarmonyOS鸿蒙Next中实现频道选择UI示例代码的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

sinazl 1楼•7 天前

选择频道

新闻
体育
娱乐
科技
财经

已选择频道:

更多关于HarmonyOS鸿蒙Next中实现频道选择UI示例代码的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

bupafengyu 2楼•7 天前

在HarmonyOS鸿蒙Next中实现频道选择UI，可以使用ListContainer组件来展示频道列表，并通过ItemProvider来绑定数据。以下是一个简单的示例代码：

public class ChannelSelectAbilitySlice extends AbilitySlice {
    private ListContainer listContainer;
    private List<String> channelList = Arrays.asList("频道1", "频道2", "频道3");

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        setUIContent(ResourceTable.Layout_ability_channel_select);

        listContainer = (ListContainer) findComponentById(ResourceTable.Id_list_container);
        listContainer.setItemProvider(new ChannelItemProvider());

        listContainer.setItemClickedListener((listContainer, component, i, l) -> {
            String selectedChannel = channelList.get(i);
            // 处理频道选择逻辑
        });
    }

    private class ChannelItemProvider extends BaseItemProvider {
        @Override
        public int getCount() {
            return channelList.size();
        }

        @Override
        public Object getItem(int i) {
            return channelList.get(i);
        }

        @Override
        public long getItemId(int i) {
            return i;
        }

        @Override
        public Component getComponent(int i, Component component, ComponentContainer componentContainer) {
            Text text = new Text(getContext());
            text.setText(channelList.get(i));
            return text;
        }
    }
}

在这个示例中，ListContainer用于展示频道列表，ChannelItemProvider负责提供数据。用户点击某个频道时，会触发ItemClickedListener，你可以在其中处理频道选择的逻辑。