 | |  |  | AIWROK软件IOS苹果Ul-垂直容器[Vertical]方法小结 //方法小结，交流QQ群711841924
//第一个方法：addView添加子控件
var label = new Label();
label.setText("Hello World");
//第二个方法：removeView移除视图
var v = new Vertical();
v.removeView(0); // 移除第一个子控件
//第三个方法：clearAllViews清空所有视图
var v = new Vertical();
v.clearAllViews(); // 清空所有控件
//第四个方法：getViewCount 获取视图数量
var v = new Vertical();
int count = v.getViewCount(); // 获取子控件的数量
//第五个方法：setSpacing设置控件间隔
var v = new Vertical();
v.setSpacing(10); // 设置控件间隔为10
//第六个方法：setContainerSize设置容器大小
var v = new Vertical();
v.setContainerSize(400, 600); // 设置容器大小为400x600
//第七个方法：setBackgroundColor 设置背景颜色
var v = new Vertical();
v.setBackgroundColor(50, 100, 150); // 设置背景颜色
//第八个方法：setAlignment 设置对齐方式
var v = new Vertical();
v.setAlignment("center"); // 设置对齐方式为居中
/*
可选值如下：
- fill: 填充对齐
- left: 左对齐
- right: 右对齐
- top: 顶部对齐
- bottom: 底部对齐
- center: 居中对齐
默认值为 fill。
*/
📌addView添加子控件 类别 | 详情说明 | 方法功能 | 向容器中添加一个子控件，多个控件会排列到一列当中 | 方法签名 | Void addView(Object view)
| 返回值 | Void
| 参数 | - Object view ：要添加的子控件对象 | 案例 | var v = new Vertical();
var btn = new Button();
v.addView(btn);
|
📌removeView移除视图 类别 | 详情说明 | 方法功能 | 根据指定索引移除容器中的子控件 | 方法签名 | Void removeView(Int32 index)
| 返回值 | Void
（无返回值） | 参数 | - Int32 index ：要移除子控件的索引 | 案例 | var v = new Vertical();
v.removeView(0); // 移除第一个子控件
|
📌clearAllViews清空所有视图 类别 | 详情说明 | 方法功能 | 移除容器中的所有子控件 | 方法签名 | Void clearAllViews()
| 返回值 | Void
（无返回值） | 参数 | 无 | 案例 | var v = new Vertical();
v.clearAllViews(); // 清空所有控件
|
📌getViewCount 获取视图数量 类别 | 详情说明 | 方法功能 | 返回当前容器中的视图数量 | 方法签名 | Int32 getViewCount()
| 返回值 | Int32
| 参数 | 无 | 案例 | var v = new Vertical();
int count = v.getViewCount(); // 获取子控件的数量
|
📌setSpacing设置控件间隔 类别 | 详情说明 | 方法功能 | 设置子控件之间的间隔 | 方法签名 | Void setSpacing(Int32 spacing)
| 返回值 | Void
| 参数 | - Int32 spacing ：间隔值 | 案例 | var v = new Vertical();
v.setSpacing(10); // 设置控件间隔为10
|
📌setContainerSize设置容器大小 类别 | 详情说明 | 方法功能 | 设置容器的宽度和高度 | 方法签名 | Void setContainerSize(Int32 width, Int32 height)
| 返回值 | Void
| 参数 | - Int32 width ：容器宽度
- Int32 height ：容器高度 | 案例 | var v = new Vertical();
v.setContainerSize(400, 600); // 设置容器大小为400x600
|
📌setBackgroundColor 设置背景颜色 类别 | 详情说明 | 方法功能 | 根据提供的 RGB 值设置容器的背景颜色 | 方法签名 | Void setBackgroundColor(Int32 red, Int32 green, Int32 blue)
| 返回值 | Void
| 参数 | - Int32 red ：红色分量
- Int32 green ：绿色分量
- Int32 blue ：蓝色分量 | 案例 | var v = new Vertical();
v.setBackgroundColor(50, 100, 150); // 设置背景颜色
|
📌setAlignment 设置对齐方式 类别 | 详情说明 | 方法功能 | 设置容器内控件的对齐方式，可选值包括 fill （填充对齐）、left （左对齐）、right （右对齐）、top （顶部对齐）、bottom （底部对齐）、center （居中对齐），默认值为 fill | 方法签名 | Void setAlignment(String alignment)
| 返回值 | Void
（无返回值） | 参数 | - String alignment ：对齐方式字符串，可选值：
- fill ：填充对齐
- left ：左对齐
- right ：右对齐
- top ：顶部对齐
- bottom ：底部对齐
- center ：居中对齐
默认值为 fill | 案例 | var v = new Vertical();
v.setAlignment("center"); // 设置对齐方式为居中
/*可选值如下：
- fill: 填充对齐
- left: 左对齐
- right: 右对齐
- top: 顶部对齐
- bottom: 底部对齐
- center: 居中对齐
默认值为 fill。
*/
|
示例： // 🔨Ul-垂直容器[Vertical]方法完整示例
// 方法小结，交流QQ群711841924
// 创建 TabView
var tab = new TabView();
// 设置标签页标题
tab.setTitles(["addView示例", "removeView示例", "其他方法示例"]);
// 显示 TabView，并在加载完成后执行回调函数
tab.show(function() {
printl("TabView 显示完成");
// ====================== 第一页：addView示例 ======================
var addViewDemo = new Vertical();
addViewDemo.setSpacing(10); // 设置控件间隔
addViewDemo.setBackgroundColor(240, 240, 240); // 设置背景颜色
// 创建说明标签
var titleLabel = new Label();
titleLabel.setText("addView方法演示");
addViewDemo.addView(titleLabel);
// 使用addView添加各种控件
var label1 = new Label();
label1.setText("这是第一个通过addView添加的标签");
addViewDemo.addView(label1);
var button1 = new Button();
button1.setText("这是通过addView添加的按钮");
button1.setColor(70, 130, 180);
button1.onClick(function() {
printl("第一页按钮被点击");
});
addViewDemo.addView(button1);
var countLabel1 = new Label();
countLabel1.setText("当前控件数量: " + addViewDemo.getViewCount());
addViewDemo.addView(countLabel1);
function updateViewCount(container, label) {
label.setText("当前控件数量: " + container.getViewCount());
}
// ====================== 第二页：removeView和clearAllViews示例 ======================
var removeViewDemo = new Vertical();
removeViewDemo.setSpacing(10);
removeViewDemo.setBackgroundColor(245, 220, 220);
// 添加多个控件用于演示删除
for (var i = 1; i <= 5; i++) {
var tempLabel = new Label();
tempLabel.setText("动态标签 " + i);
removeViewDemo.addView(tempLabel);
}
var removeFirstBtn = new Button();
removeFirstBtn.setText("移除第一个控件 (removeView)");
removeFirstBtn.setColor(220, 20, 60);
removeFirstBtn.onClick(function() {
if (removeViewDemo.getViewCount() > 2) { // 留下至少一个控件和按钮
removeViewDemo.removeView(0);
printl("已移除第一个控件，剩余控件数: " + removeViewDemo.getViewCount());
updateViewCount(removeViewDemo, countLabel2);
} else {
printl("控件不足，无法继续移除");
}
});
removeViewDemo.addView(removeFirstBtn);
var clearAllBtn = new Button();
clearAllBtn.setText("清空所有控件 (clearAllViews)");
clearAllBtn.setColor(180, 20, 220);
clearAllBtn.onClick(function() {
removeViewDemo.clearAllViews();
printl("已清空所有控件");
// 重新添加一些控件
var emptyLabel = new Label();
emptyLabel.setText("所有控件已清空");
removeViewDemo.addView(emptyLabel);
var countLabel = new Label();
countLabel.setText("当前控件数量: " + removeViewDemo.getViewCount());
removeViewDemo.addView(countLabel);
removeViewDemo.addView(removeFirstBtn);
removeViewDemo.addView(clearAllBtn);
updateViewCount(removeViewDemo, countLabel2);
});
removeViewDemo.addView(clearAllBtn);
var countLabel2 = new Label();
countLabel2.setText("当前控件数量: " + removeViewDemo.getViewCount());
removeViewDemo.addView(countLabel2);
// ====================== 第三页：其他方法示例 ======================
var otherMethodsDemo = new Vertical();
otherMethodsDemo.setContainerSize(400, 600); // 设置容器大小
otherMethodsDemo.setBackgroundColor(220, 245, 220); // 设置背景颜色
// 演示不同对齐方式
var alignmentTitle = new Label();
alignmentTitle.setText("setAlignment对齐方式演示");
otherMethodsDemo.addView(alignmentTitle);
// 默认对齐(fill)
var fillContainer = new Vertical();
fillContainer.setContainerSize(300, 60);
fillContainer.setBackgroundColor(230, 230, 250);
fillContainer.setSpacing(5);
var fillLabel = new Label();
fillLabel.setText("默认填充对齐(fill)");
fillContainer.addView(fillLabel);
otherMethodsDemo.addView(fillContainer);
// 居中对齐(center)
var centerContainer = new Vertical();
centerContainer.setContainerSize(300, 60);
centerContainer.setBackgroundColor(250, 230, 230);
centerContainer.setAlignment("center"); // 设置居中对齐
centerContainer.setSpacing(5);
var centerLabel = new Label();
centerLabel.setText("居中对齐(center)");
centerContainer.addView(centerLabel);
otherMethodsDemo.addView(centerContainer);
// 左对齐(left)
var leftContainer = new Vertical();
leftContainer.setContainerSize(300, 60);
leftContainer.setBackgroundColor(230, 250, 230);
leftContainer.setAlignment("left"); // 设置左对齐
leftContainer.setSpacing(5);
var leftLabel = new Label();
leftLabel.setText("左对齐(left)");
leftContainer.addView(leftLabel);
otherMethodsDemo.addView(leftContainer);
// 右对齐(right)
var rightContainer = new Vertical();
rightContainer.setContainerSize(300, 60);
rightContainer.setBackgroundColor(250, 250, 230);
rightContainer.setAlignment("right"); // 设置右对齐
rightContainer.setSpacing(5);
var rightLabel = new Label();
rightLabel.setText("右对齐(right)");
rightContainer.addView(rightLabel);
otherMethodsDemo.addView(rightContainer);
// 显示属性信息
var infoLabel = new Label();
infoLabel.setText("容器大小: 400x600\n背景颜色: RGB(220, 245, 220)\n控件间隔: 默认值");
otherMethodsDemo.addView(infoLabel);
// 公共返回按钮
var btnBack = new Button();
btnBack.setText("返回");
btnBack.setColor(255, 0, 0);
btnBack.onClick(function() {
printl("返回键被点击");
tab.dismiss();
});
// 添加所有页面到TabView
tab.addView(0, addViewDemo);
tab.addView(1, removeViewDemo);
tab.addView(2, otherMethodsDemo);
tab.addView(3, btnBack);
printl("视图添加完成");
});
printl("Vertical容器方法演示程序启动");
| |  | |  |
|
|( 京ICP备09078825号 )
发表于 
收藏