Что такое слайдер?
Слайдер — интерактивный элемент интерфейса, позволяющий пользователю выбирать числовое значение из заданного диапазона. Например, в приложении для контроля веса слайдер может отображать вес в килограммах в диапазоне от 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, настройка параметров изображения и обработчика событий. В дальнейшем можно добавить кнопки управления.