Слайдер в Corona SDK: создание для мобильных приложений

Что такое слайдер?

Слайдер — интерактивный элемент интерфейса, позволяющий пользователю выбирать числовое значение из заданного диапазона. Например, в приложении для контроля веса слайдер может отображать вес в килограммах в диапазоне от 40 до 140 кг.

Подготовка изображений

Для слайдера нужно изображение, разделённое на части: левую (частично заполненную), среднюю незаполненную, среднюю заполненную, правую (частично заполненную) и ползунок. Изображение можно скачать с aquiparaver.com. Рекомендуется поместить его в папку проекта (например, «img»). Для создания изображения подойдут Paint.NET или GIMP.

Подключение библиотеки и настройка параметров

Подключим библиотеку widget:

local widget = require "widget"

Зададим начальное значение слайдера (например, 60):

local weight = 60

Создадим объект с параметрами:

local sliderOptions = {
    frame = {
        {x=0, y=0, width=15, height=45}, -- Левая часть
        {x=15, y=0, width=130, height=45}, -- Средняя (незаполненная)
        {x=145, y=0, width=15, height=45}, -- Средняя (заполненная)
        {x=160, y=0, width=15, height=45}, -- Правая часть
        {x=175, y=0, width=47, height=47} -- Ползунок
    },
    contentWidth = 360,
    contentHeight = 45
}

Здесь указаны координаты и размеры каждой части изображения.

Создание слайдера

Создадим слайдер с помощью widget.newSlider:

local mySlider = widget.newSlider {
    width = 360,
    height = 47,
    x = 91,
    y = 110,
    orientation = "horizontal",
    default = (weight - 40) / (140 - 40) * 100,  -- Начальное значение ползунка
    image = graphics.newImageRect( "img/slider.png", sliderOptions.contentWidth, sliderOptions.contentHeight ),
    frames = sliderOptions.frame,
    listener = function(event)
        local newWeight = math.floor(40 + (140 - 40) * event.value / 100)
        weight = newWeight
        myWeight.text = weight -- Предполагается, что myWeight - это существующий объект текстового поля
    end
}

Указаны изображение, размеры, позиция, ориентация, начальное значение и обработчик событий (listener).

Обработка событий

listener отслеживает изменение позиции ползунка. Формула 40 + (140 — 40) * event.value / 100 переводит значение ползунка (от 0 до 100) в диапазон от 40 до 140. math.floor округляет результат. Полученное значение выводится в текстовое поле myWeight.

Создан функциональный слайдер. Ключевые моменты: подключение библиотеки widget, настройка параметров изображения и обработчика событий. В дальнейшем можно добавить кнопки управления.

Что будем искать? Например,программа