Corona手游教程之widget:PickerWheel篇

首先什么是pickerWheel,如下图所示:

这是移动设备上交互创新的典型控件,非常适合触屏进行选择,对应PC上的下拉框。

在Corona中pickerWheel被设定为320X222像素大小。我们可以使用默认样式或定制化的pickerWheel。另外,请注意列的总宽度实际是280像素,因为要扣除左右两边的20像素边框大小。

为了节约内存,pickerWheel在定制化的时候同样使用Image Sheet。pickerWheel不支持对其宽度和高度进行伸缩(scale)或改变其.width或height属性。

创建pickerWheel的方式为:

widget.newPickerWheel( options )

其options公共字段为:

  • id:(可选)一个赋予pickerWheel的标识字符串,默认为widget_pickerWheel
  • x, y:(可选)origin坐标
  • left, top:(可选)左上角坐标
  • columns:一个table,为每一个单独的列包含一个子表。

获取pickerWheel当前选中的值的方式如下:

object:getValues()

 

配置列数据

pickerWheel中的列,被定义成有顺序的一系列table,一起存放在columns字段里。

这些列将被从左到右添加进pickerWheel,按照你定义他们的顺序:

labels:每一行展示的标题(按顺序),例如:labels = { "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday" }

Number:(可选)默认情况下,列被均匀地分割在pickerWheel的可视区域,但是一个指定的列宽度可以通过本属性来定义。注意,所有列的总宽度加起来最大只能是280

align:(可选)指定文本标题在列中的对齐方式。可接受的值为“left”,“right”,“center”。默认为“center”。

startIndex:本列的初始选择的行。这个值不可以大于列的总个数范围。

 

基本样式

  • font:(可选)为pickerWheel的列设置字体。默认是native.systemFontBold
  • fontSize:(可选)列内容字体的大小。默认为22
  • columnColor:指定RGBA作为pickerWheel列背景的颜色,table如:columnColor = { 0.8, 0.8, 0.8 }
local widget = require( "widget" )

-- Create two tables to hold data for days and years      
local days = {}
local years = {}

-- Populate the "days" table
for d = 1, 31 do
    days[d] = d
end

-- Populate the "years" table
for y = 1, 48 do
    years[y] = 1969 + y
end

-- Configure the picker wheel columns
local columnData = 
{
    -- Months
    { 
        align = "right",
        width = 140,
        startIndex = 5,
        labels = { "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" }
    },
    -- Days
    {
        align = "center",
        width = 60,
        startIndex = 18,
        labels = days
    },
    -- Years
    {
        align = "center",
        width = 80,
        startIndex = 10,
        labels = years
    }
}

-- Create the widget
local pickerWheel = widget.newPickerWheel
{
    top = display.contentHeight - 222,
    columns = columnData
}

-- Get the table of current values for all columns
-- This can be performed on a button tap, timer execution, or other event
local values = pickerWheel:getValues()

-- Get the value for each column in the wheel (by column index)
local currentMonth = values[1].value
local currentDay = values[2].value
local currentYear = values[3].value

print( currentMonth, currentDay, currentYear )

 

定制样式:

pickerWheel可以用ImageSheet的帧来进行定制样式。这需要3帧:一个覆层边界/边框,一个处于覆层底下的背景帧,和一个可选的自动放在列之间的分割线(切割列),举例如下图:

  • sheet:pickerWheel使用的imageSheet
  • backgroundFrame:处于pickerWheel底部的背景图片的帧序号
  • backgroundFrameWidth,backgroundFameHeight:背景帧的宽度和高度。这个图片将会被拉伸到控件的大小,所以你直接设计成320X222来阻止其变形
  • overlayFrame:覆层图片(包围框或覆层)的帧序号
  • overlayFrameWidth,overlayFrameHeight:覆层图帧的宽度和高度。这个图片最好也设计成320X222
  • separatorFrame:(可选)分割线图片的帧序列。这些分割线将会 自动放在列之间。
  • separatorFrameWidth,separatorFrameHeight:(可选)分割线图片帧的宽度和高度,需要separatorFrame先被指定
local widget = require( "widget" )

-- Create two tables to hold data for days and years      
local days = {}
local years = {}

-- Populate the "days" table
for d = 1, 31 do
    days[d] = d
end

-- Populate the "years" table
for y = 1, 48 do
    years[y] = 1969 + y
end

-- Configure the picker wheel columns
local columnData = 
{
    -- Months
    { 
        align = "right",
        width = 140,
        startIndex = 5,
        labels = { "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" }
    },
    -- Days
    {
        align = "center",
        width = 60,
        startIndex = 18,
        labels = days
    },
    -- Years
    {
        align = "center",
        width = 80,
        startIndex = 10,
        labels = years
    }
}

-- Image sheet options and declaration
local options = {
    frames = 
    {
        { x=0, y=0, width=320, height=222 },
        { x=320, y=0, width=320, height=222 },
        { x=640, y=0, width=8, height=222 }
    },
    sheetContentWidth = 648,
    sheetContentHeight = 222
}
local pickerWheelSheet = graphics.newImageSheet( "pickerSheet.png", options )

-- Create the widget
local pickerWheel2 = widget.newPickerWheel
{
    top = display.contentHeight - 222,
    columns = columnData,
    sheet = pickerWheelSheet,
    overlayFrame = 1,
    overlayFrameWidth = 320,
    overlayFrameHeight = 222,
    backgroundFrame = 2,
    backgroundFrameWidth = 320,
    backgroundFrameHeight = 222,
    separatorFrame = 3,
    separatorFrameWidth = 8,
    separatorFrameHeight = 222,
    columnColor = { 0, 0, 0, 0 },
    fontColor = { 0.4, 0.4, 0.4, 0.5 },
    fontColorSelected = { 0.2, 0.6, 0.4 }
}

-- Get the table of current values for all columns
-- This can be performed on a button tap, timer execution, or other event
local values = pickerWheel:getValues()

-- Get the value for each column in the wheel (by column index)
local currentMonth = values[1].value
local currentDay = values[2].value
local currentYear = values[3].value

print( currentMonth, currentDay, currentYear )

 

转载于:https://www.cnblogs.com/leezj/p/4242211.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
代码下载:完整代码,可直接运行 ;运行版本:2022a或2019b或2014a;若运行有问题,可私信博主; **仿真咨询 1 各类智能优化算法改进及应用** 生产调度、经济调度、装配线调度、充电优化、车间调度、发车优化、水库调度、三维装箱、物流选址、货位优化、公交排班优化、充电桩布局优化、车间布局优化、集装箱船配载优化、水泵组合优化、解医疗资源分配优化、设施布局优化、可视域基站和无人机选址优化 **2 机器学习和深度学习方面** 卷积神经网络(CNN)、LSTM、支持向量机(SVM)、最小二乘支持向量机(LSSVM)、极限学习机(ELM)、核极限学习机(KELM)、BP、RBF、宽度学习、DBN、RF、RBF、DELM、XGBOOST、TCN实现风电预测、光伏预测、电池寿命预测、辐射源识别、交通流预测、负荷预测、股价预测、PM2.5浓度预测、电池健康状态预测、水体光学参数反演、NLOS信号识别、地铁停车精准预测、变压器故障诊断 **3 图像处理方面** 图像识别、图像分割、图像检测、图像隐藏、图像配准、图像拼接、图像融合、图像增强、图像压缩感知 **4 路径规划方面** 旅行商问题(TSP)、车辆路径问题(VRP、MVRP、CVRP、VRPTW等)、无人机三维路径规划、无人机协同、无人机编队、机器人路径规划、栅格地图路径规划、多式联运运输问题、车辆协同无人机路径规划、天线线性阵列分布优化、车间布局优化 **5 无人机应用方面** 无人机路径规划、无人机控制、无人机编队、无人机协同、无人机任务分配 **6 无线传感器定位及布局方面** 传感器部署优化、通信协议优化、路由优化、目标定位优化、Dv-Hop定位优化、Leach协议优化、WSN覆盖优化、组播优化、RSSI定位优化 **7 信号处理方面** 信号识别、信号加密、信号去噪、信号增强、雷达信号处理、信号水印嵌入提取、肌电信号、脑电信号、信号配时优化 **8 电力系统方面** 微电网优化、无功优化、配电网重构、储能配置 **9 元胞自动机方面** 交通流 人群疏散 病毒扩散 晶体生长 **10 雷达方面** 卡尔曼滤波跟踪、航迹关联、航迹融合

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值