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

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

介绍

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

频道选择UI源码链接

效果预览

图片名称

使用说明

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

实现思路

  1. 点击按钮进行编辑完成状态切换。

  2. 拖动图标修改其顺序。

  3. 在编辑状态下点击删除按钮进行图标删除。


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

2 回复

有帮助

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


在HarmonyOS鸿蒙Next中,频道选择UI可以通过TabListTab组件实现。以下是一个简单的示例代码:

import ohos.agp.components.TabList;
import ohos.agp.components.Text;
import ohos.app.Context;

public class ChannelSelector {
    private TabList tabList;
    private Context context;

    public ChannelSelector(Context context) {
        this.context = context;
        initUI();
    }

    private void initUI() {
        tabList = new TabList(context);
        tabList.setOrientation(TabList.Orientation.HORIZONTAL);

        TabList.Tab tab1 = tabList.new Tab(context);
        tab1.setText("频道1");
        tabList.addTab(tab1);

        TabList.Tab tab2 = tabList.new Tab(context);
        tab2.setText("频道2");
        tabList.addTab(tab2);

        tabList.addTabSelectedListener(new TabList.TabSelectedListener() {
            @Override
            public void onSelected(TabList.Tab tab) {
                // 处理频道选择逻辑
                String selectedChannel = tab.getText();
                // 执行相应操作
            }

            @Override
            public void onUnselected(TabList.Tab tab) {
                // 处理取消选择逻辑
            }

            @Override
            public void onReselected(TabList.Tab tab) {
                // 处理重新选择逻辑
            }
        });
    }

    public TabList getTabList() {
        return tabList;
    }
}

此代码创建了一个水平排列的频道选择器,用户可以选择不同的频道并触发相应的事件处理逻辑。

回到顶部