AIWROK软件苹果脚本案例1空白站位[Space]方法 - B2B网络软件

// 🔨🍎UI-空白站位[Space]完整综合示例
// 系统展示Space控件的所有功能和实际应用场景
// 交流QQ群711841924
printl("=== Space控件完整综合示例启动 ===");
// 显示Toast提示
function showToast(message) {
if (typeof toast !== 'undefined') {
// 检查toast是否为函数
if (typeof toast === 'function') {
toast(message);
} else if (toast && typeof toast.show === 'function') {
// 假设toast是一个对象，有show方法
toast.show(message);
} else {
printl("[Toast] " + message);
}
} else {
printl("[Toast] " + message);
}
}
// 日志记录
function logInteraction(message) {
printl("[交互] " + message);
}
var vc = new IOSView();
vc.show(function() {
printl("Space综合示例界面已加载");
// 获取当前视图
var view = vc.getView();
// 创建主容器
var mainContainer = new Vertical();
mainContainer.setSpacing(15);
mainContainer.setBackgroundColor(245, 245, 245);
// 标题区域
var titleContainer = new Vertical();
titleContainer.setAlignment("fill");
titleContainer.setSpacing(5);
titleContainer.setBackgroundColor(0, 122, 255);
var titleLabel = new Label();
titleLabel.setText("🔨 Space控件完整综合示例");
titleLabel.setFontSize(18.0);
titleLabel.setTextColor(255, 255, 255);
titleLabel.setTextAlignment("center");
titleLabel.setWidth(320); // 设置固定宽度以确保背景填充
var subtitleLabel = new Label();
subtitleLabel.setText("空白站位控件的全方位应用");
subtitleLabel.setFontSize(12.0);
subtitleLabel.setTextColor(255, 255, 255);
subtitleLabel.setTextAlignment("center");
subtitleLabel.setWidth(320); // 设置固定宽度以确保背景填充
titleContainer.addView(titleLabel);
titleContainer.addView(subtitleLabel);
mainContainer.addView(titleContainer);
// Space核心方法演示区域
var coreDemoContainer = new Vertical();
coreDemoContainer.setBackgroundColor(255, 255, 255);
coreDemoContainer.setSpacing(15);
var coreTitle = new Label();
coreTitle.setText("🎯 Space核心方法演示");
coreTitle.setFontSize(16.0);
coreTitle.setTextColor(0, 0, 0);
coreTitle.setTextAlignment("center");
coreDemoContainer.addView(coreTitle);
// 方法1：setWidth设置宽度
var widthDemo = new Vertical();
widthDemo.setSpacing(8);
var widthLabel = new Label();
widthLabel.setText("📏 setWidth - 设置宽度");
widthLabel.setFontSize(14.0);
widthLabel.setTextColor(0, 122, 255);
widthDemo.addView(widthLabel);
var widthDesc = new Label();
widthDesc.setText("创建不同宽度的空白占位，用于水平布局调整");
widthDesc.setFontSize(12.0);
widthDesc.setTextColor(100, 100, 100);
widthDemo.addView(widthDesc);
var widthContainer = new Horizontal();
widthContainer.setSpacing(5);
widthContainer.setBackgroundColor(240, 240, 240);
var wLabel1 = new Label();
wLabel1.setText("左");
wLabel1.setFontSize(12.0);
wLabel1.setBackgroundColor(0, 122, 255);
wLabel1.setTextColor(255, 255, 255);
var space1 = new Space();
space1.setWidth(30.0);
space1.setBackgroundColor(200, 200, 200);
var wLabel2 = new Label();
wLabel2.setText("中");
wLabel2.setFontSize(12.0);
wLabel2.setBackgroundColor(52, 199, 89);
wLabel2.setTextColor(255, 255, 255);
var space2 = new Space();
space2.setWidth(60.0);
space2.setBackgroundColor(200, 200, 200);
var wLabel3 = new Label();
wLabel3.setText("右");
wLabel3.setFontSize(12.0);
wLabel3.setBackgroundColor(255, 149, 0);
wLabel3.setTextColor(255, 255, 255);
widthContainer.addView(wLabel1);
widthContainer.addView(space1);
widthContainer.addView(wLabel2);
widthContainer.addView(space2);
widthContainer.addView(wLabel3);
widthDemo.addView(widthContainer);
coreDemoContainer.addView(widthDemo);
// 分割线
var separator1 = new Space();
separator1.setHeight(10.0);
coreDemoContainer.addView(separator1);
// 方法2：setHeight设置高度
var heightDemo = new Vertical();
heightDemo.setSpacing(8);
var heightLabel = new Label();
heightLabel.setText("📏 setHeight - 设置高度");
heightLabel.setFontSize(14.0);
heightLabel.setTextColor(0, 122, 255);
heightDemo.addView(heightLabel);
var heightDesc = new Label();
heightDesc.setText("创建不同高度的空白占位，用于垂直布局调整");
heightDesc.setFontSize(12.0);
heightDesc.setTextColor(100, 100, 100);
heightDemo.addView(heightDesc);
var heightContainer = new Vertical();
heightContainer.setBackgroundColor(240, 240, 240);
var hLabel1 = new Label();
hLabel1.setText("上");
hLabel1.setFontSize(12.0);
hLabel1.setBackgroundColor(0, 122, 255);
hLabel1.setTextColor(255, 255, 255);
hLabel1.setTextAlignment("center");
var space3 = new Space();
space3.setHeight(20.0);
space3.setBackgroundColor(200, 200, 200);
var hLabel2 = new Label();
hLabel2.setText("中");
hLabel2.setFontSize(12.0);
hLabel2.setBackgroundColor(52, 199, 89);
hLabel2.setTextColor(255, 255, 255);
hLabel2.setTextAlignment("center");
var space4 = new Space();
space4.setHeight(40.0);
space4.setBackgroundColor(200, 200, 200);
var hLabel3 = new Label();
hLabel3.setText("下");
hLabel3.setFontSize(12.0);
hLabel3.setBackgroundColor(255, 149, 0);
hLabel3.setTextColor(255, 255, 255);
hLabel3.setTextAlignment("center");
heightContainer.addView(hLabel1);
heightContainer.addView(space3);
heightContainer.addView(hLabel2);
heightContainer.addView(space4);
heightContainer.addView(hLabel3);
heightDemo.addView(heightContainer);
coreDemoContainer.addView(heightDemo);
// 分割线
var separator2 = new Space();
separator2.setHeight(10.0);
coreDemoContainer.addView(separator2);
// 方法3：setBackgroundColor设置背景颜色
var colorDemo = new Vertical();
colorDemo.setSpacing(8);
var colorLabel = new Label();
colorLabel.setText("🎨 setBackgroundColor - 设置背景颜色");
colorLabel.setFontSize(14.0);
colorLabel.setTextColor(0, 122, 255);
colorDemo.addView(colorLabel);
var colorDesc = new Label();
colorDesc.setText("为空白占位设置背景颜色，用于视觉分隔或装饰");
colorDesc.setFontSize(12.0);
colorDesc.setTextColor(100, 100, 100);
colorDemo.addView(colorDesc);
var colorContainer = new Horizontal();
colorContainer.setSpacing(10);
var space5 = new Space();
space5.setWidth(50.0);
space5.setHeight(50.0);
space5.setBackgroundColor(255, 0, 0);
var space6 = new Space();
space6.setWidth(50.0);
space6.setHeight(50.0);
space6.setBackgroundColor(0, 255, 0);
var space7 = new Space();
space7.setWidth(50.0);
space7.setHeight(50.0);
space7.setBackgroundColor(0, 0, 255);
var space8 = new Space();
space8.setWidth(50.0);
space8.setHeight(50.0);
space8.setBackgroundColor(255, 255, 0);
colorContainer.addView(space5);
colorContainer.addView(space6);
colorContainer.addView(space7);
colorContainer.addView(space8);
colorDemo.addView(colorContainer);
coreDemoContainer.addView(colorDemo);
mainContainer.addView(coreDemoContainer);
// 实际应用场景
var applicationContainer = new Vertical();
applicationContainer.setBackgroundColor(255, 255, 255);
applicationContainer.setSpacing(15);
var appTitle = new Label();
appTitle.setText("💼 Space实际应用场景");
appTitle.setFontSize(16.0);
appTitle.setTextColor(0, 0, 0);
appTitle.setTextAlignment("center");
applicationContainer.addView(appTitle);
// 场景1：表单布局
var formContainer = new Vertical();
formContainer.setSpacing(10);
var formTitle = new Label();
formTitle.setText("📋 表单布局示例");
formTitle.setFontSize(14.0);
formTitle.setTextColor(0, 122, 255);
formContainer.addView(formTitle);
// 姓名输入行
var nameRow = new Horizontal();
nameRow.setSpacing(10);
var nameLabel = new Label();
nameLabel.setText("姓名:");
nameLabel.setWidth(60);
nameLabel.setTextColor(0, 0, 0);
var nameInput = new Label();
nameInput.setText("请输入姓名");
nameInput.setBackgroundColor(240, 240, 240);
nameRow.addView(nameLabel);
nameRow.addView(nameInput);
formContainer.addView(nameRow);
// 垂直间距
var formSpace1 = new Space();
formSpace1.setHeight(10.0);
formContainer.addView(formSpace1);
// 年龄输入行
var ageRow = new Horizontal();
ageRow.setSpacing(10);
var ageLabel = new Label();
ageLabel.setText("年龄:");
ageLabel.setWidth(60);
ageLabel.setTextColor(0, 0, 0);
var ageInput = new Label();
ageInput.setText("请输入年龄");
ageInput.setBackgroundColor(240, 240, 240);
ageRow.addView(ageLabel);
ageRow.addView(ageInput);
formContainer.addView(ageRow);
// 垂直间距
var formSpace2 = new Space();
formSpace2.setHeight(10.0);
formContainer.addView(formSpace2);
// 邮箱输入行
var emailRow = new Horizontal();
emailRow.setSpacing(10);
var emailLabel = new Label();
emailLabel.setText("邮箱:");
emailLabel.setWidth(60);
emailLabel.setTextColor(0, 0, 0);
var emailInput = new Label();
emailInput.setText("请输入邮箱");
emailInput.setBackgroundColor(240, 240, 240);
emailRow.addView(emailLabel);
emailRow.addView(emailInput);
formContainer.addView(emailRow);
applicationContainer.addView(formContainer);
// 场景2：卡片布局
var cardContainer = new Vertical();
cardContainer.setSpacing(10);
var cardTitle = new Label();
cardTitle.setText("📄 卡片布局示例");
cardTitle.setFontSize(14.0);
cardTitle.setTextColor(0, 122, 255);
cardContainer.addView(cardTitle);
var card = new Vertical();
card.setBackgroundColor(255, 255, 255);
card.setSpacing(10);
var cardHeader = new Horizontal();
cardHeader.setSpacing(10);
var cardIcon = new Label();
cardIcon.setText("📱");
cardIcon.setFontSize(24.0);
var cardInfo = new Vertical();
cardInfo.setSpacing(2);
var cardName = new Label();
cardName.setText("产品名称");
cardName.setFontSize(16.0);
cardName.setTextColor(0, 0, 0);
var cardDesc = new Label();
cardDesc.setText("这是一个产品描述");
cardDesc.setFontSize(12.0);
cardDesc.setTextColor(100, 100, 100);
cardInfo.addView(cardName);
cardInfo.addView(cardDesc);
cardHeader.addView(cardIcon);
cardHeader.addView(cardInfo);
card.addView(cardHeader);
// 卡片内容
var cardContent = new Label();
cardContent.setText("卡片内容区域，展示详细信息...");
cardContent.setFontSize(14.0);
cardContent.setTextColor(50, 50, 50);
card.addView(cardContent);
// 卡片底部
var cardFooter = new Horizontal();
cardFooter.setSpacing(10);
var priceLabel = new Label();
priceLabel.setText("¥99.00");
priceLabel.setFontSize(16.0);
priceLabel.setTextColor(255, 59, 48);
var buyButton = new Button();
buyButton.setText("购买");
buyButton.setColor(0, 122, 255);
buyButton.setTextColor(255, 255, 255);
buyButton.setWidth(80);
buyButton.setHeight(30);
// 使用Space创建间距
var footerSpace = new Space();
cardFooter.addView(priceLabel);
cardFooter.addView(footerSpace);
cardFooter.addView(buyButton);
card.addView(cardFooter);
cardContainer.addView(card);
applicationContainer.addView(cardContainer);
// 场景3：导航栏布局
var navContainer = new Vertical();
navContainer.setSpacing(10);
var navTitle = new Label();
navTitle.setText("🧭 导航栏布局示例");
navTitle.setFontSize(14.0);
navTitle.setTextColor(0, 122, 255);
navContainer.addView(navTitle);
var navBar = new Horizontal();
navBar.setSpacing(10);
navBar.setBackgroundColor(240, 240, 240);
var backButton = new Button();
backButton.setText("返回");
backButton.setColor(0, 122, 255);
backButton.setTextColor(255, 255, 255);
backButton.setWidth(80);
backButton.setHeight(30);
var navSpace = new Space();
var titleButton = new Button();
titleButton.setText("首页");
titleButton.setColor(52, 199, 89);
titleButton.setTextColor(255, 255, 255);
titleButton.setWidth(80);
titleButton.setHeight(30);
var menuButton = new Button();
menuButton.setText("菜单");
menuButton.setColor(255, 149, 0);
menuButton.setTextColor(255, 255, 255);
menuButton.setWidth(80);
menuButton.setHeight(30);
navBar.addView(backButton);
navBar.addView(navSpace);
navBar.addView(titleButton);
navBar.addView(menuButton);
navContainer.addView(navBar);
applicationContainer.addView(navContainer);
mainContainer.addView(applicationContainer);
// 交互功能演示
var interactionContainer = new Vertical();
interactionContainer.setBackgroundColor(236, 245, 255);
interactionContainer.setSpacing(15);
var interactionTitle = new Label();
interactionTitle.setText("🔄 交互功能演示");
interactionTitle.setFontSize(16.0);
interactionTitle.setTextColor(0, 122, 255);
interactionContainer.addView(interactionTitle);
var interactionDesc = new Label();
interactionDesc.setText("点击下方按钮体验Space控件的动态效果");
interactionDesc.setFontSize(12.0);
interactionDesc.setTextColor(100, 100, 100);
interactionContainer.addView(interactionDesc);
var dynamicContainer = new Vertical();
dynamicContainer.setSpacing(10);
var dynamicSpace = new Space();
dynamicSpace.setHeight(50.0);
dynamicSpace.setBackgroundColor(200, 200, 200);
dynamicContainer.addView(dynamicSpace);
var controlButtons = new Horizontal();
controlButtons.setSpacing(10);
controlButtons.setAlignment("center");
var increaseButton = new Button();
increaseButton.setText("增加高度");
increaseButton.setColor(0, 122, 255);
increaseButton.setTextColor(255, 255, 255);
increaseButton.setWidth(100);
increaseButton.setHeight(35);
var decreaseButton = new Button();
decreaseButton.setText("减少高度");
decreaseButton.setColor(255, 59, 48);
decreaseButton.setTextColor(255, 255, 255);
decreaseButton.setWidth(100);
decreaseButton.setHeight(35);
var changeColorButton = new Button();
changeColorButton.setText("改变颜色");
changeColorButton.setColor(52, 199, 89);
changeColorButton.setTextColor(255, 255, 255);
changeColorButton.setWidth(100);
changeColorButton.setHeight(35);
controlButtons.addView(increaseButton);
controlButtons.addView(decreaseButton);
controlButtons.addView(changeColorButton);
dynamicContainer.addView(controlButtons);
interactionContainer.addView(dynamicContainer);
mainContainer.addView(interactionContainer);
// 控件信息区域
var infoContainer = new Vertical();
infoContainer.setBackgroundColor(255, 255, 255);
infoContainer.setSpacing(8);
var infoTitle = new Label();
infoTitle.setText("ℹ️ Space控件说明");
infoTitle.setFontSize(16.0);
infoTitle.setTextColor(0, 122, 255);
infoContainer.addView(infoTitle);
var info1 = new Label();
info1.setText("• Space控件用于创建空白占位区域");
info1.setFontSize(12.0);
info1.setTextColor(52, 58, 64);
infoContainer.addView(info1);
var info2 = new Label();
info2.setText("• 核心方法：setWidth()、setHeight()、setBackgroundColor()");
info2.setFontSize(12.0);
info2.setTextColor(52, 58, 64);
infoContainer.addView(info2);
var info3 = new Label();
info3.setText("• 应用场景：布局间距、视觉分隔、响应式布局");
info3.setFontSize(12.0);
info3.setTextColor(52, 58, 64);
infoContainer.addView(info3);
var info4 = new Label();
info4.setText("• 优势：轻量级、灵活、不占用系统资源");
info4.setFontSize(12.0);
info4.setTextColor(52, 58, 64);
infoContainer.addView(info4);
mainContainer.addView(infoContainer);
// 底部操作按钮
var bottomContainer = new Horizontal();
bottomContainer.setSpacing(10);
bottomContainer.setAlignment("center");
var saveButton = new Button();
saveButton.setText("保存示例");
saveButton.setColor(52, 199, 89);
saveButton.setTextColor(255, 255, 255);
saveButton.setHeight(40);
var resetButton = new Button();
resetButton.setText("重置示例");
resetButton.setColor(255, 149, 0);
resetButton.setTextColor(255, 255, 255);
resetButton.setHeight(40);
var exitButton = new Button();
exitButton.setText("退出示例");
exitButton.setColor(255, 59, 48);
exitButton.setTextColor(255, 255, 255);
exitButton.setHeight(40);
bottomContainer.addView(saveButton);
bottomContainer.addView(resetButton);
bottomContainer.addView(exitButton);
mainContainer.addView(bottomContainer);
// 添加到主视图
view.addView(mainContainer);
printl("Space综合示例界面构建完成");
// 绑定事件处理
// 表单输入点击事件 - 注释掉Label的onClick事件，因为Label可能不支持此方法
/*
nameInput.onClick(function() {
nameInput.setText("张三");
nameInput.setBackgroundColor(200, 230, 255);
showToast("姓名已自动填充");
logInteraction("点击了姓名输入框，自动填充为'张三'");
});
ageInput.onClick(function() {
ageInput.setText("25");
ageInput.setBackgroundColor(200, 230, 255);
showToast("年龄已自动填充");
logInteraction("点击了年龄输入框，自动填充为'25'");
});
emailInput.onClick(function() {
emailInput.setText("zhangsan@example.com");
emailInput.setBackgroundColor(200, 230, 255);
showToast("邮箱已自动填充");
logInteraction("点击了邮箱输入框，自动填充为'zhangsan@example.com'");
});
*/
// 卡片购买按钮点击事件
buyButton.onClick(function() {
showToast("购买成功！");
logInteraction("点击了购买按钮");
});
// 导航栏按钮点击事件
backButton.onClick(function() {
showToast("返回上一页");
logInteraction("点击了返回按钮");
});
titleButton.onClick(function() {
showToast("跳转到首页");
logInteraction("点击了首页按钮");
});
menuButton.onClick(function() {
showToast("打开菜单");
logInteraction("点击了菜单按钮");
});
// 动态效果按钮点击事件
var currentHeight = 50;
increaseButton.onClick(function() {
currentHeight += 20;
dynamicSpace.setHeight(currentHeight);
showToast("Space高度增加到：" + currentHeight + "px");
logInteraction("点击了增加高度按钮，当前高度：" + currentHeight + "px");
});
decreaseButton.onClick(function() {
if (currentHeight > 20) {
currentHeight -= 20;
dynamicSpace.setHeight(currentHeight);
showToast("Space高度减少到：" + currentHeight + "px");
logInteraction("点击了减少高度按钮，当前高度：" + currentHeight + "px");
} else {
showToast("高度已达到最小值");
logInteraction("点击了减少高度按钮，已达到最小值");
}
});
var colors = [[255, 0, 0], [0, 255, 0], [0, 0, 255], [255, 255, 0], [255, 0, 255], [0, 255, 255]];
var colorIndex = 0;
changeColorButton.onClick(function() {
colorIndex = (colorIndex + 1) % colors.length;
var color = colors[colorIndex];
dynamicSpace.setBackgroundColor(color[0], color[1], color[2]);
showToast("Space颜色已改变");
logInteraction("点击了改变颜色按钮，当前颜色：RGB(" + color[0] + "," + color[1] + "," + color[2] + ")");
});
// 底部按钮点击事件
saveButton.onClick(function() {
showToast("示例已保存");
logInteraction("点击了保存示例按钮");
});
resetButton.onClick(function() {
// 重置表单
nameInput.setText("请输入姓名");
nameInput.setBackgroundColor(240, 240, 240);
ageInput.setText("请输入年龄");
ageInput.setBackgroundColor(240, 240, 240);
emailInput.setText("请输入邮箱");
emailInput.setBackgroundColor(240, 240, 240);
// 重置动态Space
currentHeight = 50;
dynamicSpace.setHeight(currentHeight);
dynamicSpace.setBackgroundColor(200, 200, 200);
colorIndex = 0;
showToast("示例已重置");
logInteraction("点击了重置示例按钮");
});
exitButton.onClick(function() {
showToast("退出示例");
logInteraction("点击了退出示例按钮");
vc.dismiss();
});
});
printl("Space控件完整综合示例已启动");

复制代码