Перейти к содержимому
Zer0Galaxy

"Лёгкая" библиотека GUI

Рекомендуемые сообщения

Для работы с библиотекой подключим её стандартным способом

forms=require("forms") 

Библиотека forms содержит следующие функции:

addForm() - создает новую форму.

run(form) - запускает обработку интерфейса, устанавливая активной форму form. 

stop() - прерывает обработку интерфейса.

 

Форма. Создается при помощи команды:

Form1=forms.addForm()

По сути, форма - это область на экране в которой размещаются компоненты интерфейса. Если форма активна, размещенные в ней компоненты реагируют на действия мыши. Форм в Вашей программе может быть несколько, но активной будет только одна.

По умолчанию форма занимает всю область экрана. Изменить размеры формы можно задавая её параметры W и H:

Form1.W=31
Form1.H=7

а положение на экране - задавая параметры left и top:

Form1.left=10
Form1.top =5

Помимо W, H, left и top форма обладает такими свойствами:

border - наличие рамки 0-нет рамки; 1-одинарная рамка; 2-двойная рамка (по умолчанию - 0)

color - цвет формы (по умолчанию - 0х000000),

fontColor - цвет рамки (по умолчанию - 0xffffff).

 

Форма обладает следующими методами:

setActive() - устанавливает форму активной и перерисовывает её.

isActive() - возвращает true, если форма активна.

redraw() - принудительно перерисовывает форму, если форма активна.

addButton(left, top, caption, onClick) - добавляет на форму кнопку.

addLabel(left, top, caption) - добавляет на форму строку текста.

addEdit(left, top, onEnter) - добавляет на форму окно ввода.

addFrame(left, top, brd) - добавляет на форму рамку.

addList(left, top, onChange) - добавляет на форму список.

 

Поскольку форма является объектом, методы формы следует вызывать через двоеточие

Form1:setActive()

Все свойства и методы формы (за исключением setActive и isActive) присущи также другим компонентам интерфейса, которые я опишу позже.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Кнопка. Создается командой:

Button1=Form1:addButton(left,top,caption,onClick)

Команда создает на форме Form1 кнопку и возвращает указатель на вновь созданный объект.

Еще раз обращаю внимание: метод forms.addForm вызывается через разделитель "точка", а Form1:addButton - через "двоеточие", поскольку forms - это библиотека, а Form1 - объект.

 

Параметры вызова метода addButton:

left,top - (числа) координаты левого верхнего угла кнопки относительно объекта, которому принадлежит кнопка.

caption - (строка) надпись на кнопке.

onClick - (функция) обработчик нажатия на кнопку.

Левый щелчок мыши на кнопке вызовет функцию-обработчик. Функция-обработчик принимает один параметр - указатель на кнопку, которая была нажата. 

 

Дополнительные свойства кнопки:

W - ширина кнопки (по умолчанию - 10)

H - высота кнопки (по умолчанию - 1)

border - наличие рамки (по умолчанию - 0)

color - цвет кнопки (по умолчанию - 0x606060),

fontColor - цвет надписи и рамки (по умолчанию - 0xffffff).

visible - имеет значение false, если кнопка скрыта (по умолчанию - true)

X, Y - абсолютные координаты левого верхнего угла кнопки

 

Методы компонента:

hide() - скрывает компонент.

show() - отображает ранее скрытый компонент

isVisible() - возвращает true, если компонент не скрыт и находится на активной форме.

redraw() - принудительно перерисовывает компонент.

 

Компоненты интерфейса (кнопки, надписи и т.д.) можно создавать не только на форме, но и на других компонентах. К примеру, кнопку можно создать на рамке или надпись на кнопке. При этом дочерний объект будет перемещаться, исчезать и появляться вместе с объектом-родителем.

Изменено пользователем Zer0Galaxy

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Надпись. Создается командой:



Label1=Form1:addLabel(left,top,caption)

Команда создает на форма Form1 надпись и возвращает указатель на вновь созданный объект.


 


Параметры вызова метода addLabel:


left,top - (числа) координаты левого верхнего угла надписи относительно объекта которому принадлежит надпись.


caption - (строка) собственно надпись.


 


Дополнительные свойства:


W - ширина надписи (по умолчанию равняется количеству символов в надписи). Если количество символов превышает ширину, лишние символы справа будут обрезаны.


H - высота (по умолчанию - 1)


border - наличие рамки (по умолчанию - 0)


color - цвет фона (по умолчанию - 0x000000),


fontColor - цвет шрифта (по умолчанию - 0xffffff).


visible - имеет значение false, если надпись скрыта (по умолчанию - true)


centered - если этот параметр у становить в true, надпись будет автоматически центрироваться. (По умолчанию - false) 


alignRight - если этот параметр установить в true и centered==false, надпись будет выравниваться по правому краю. (По умолчанию - false)


autoSize - если этот параметр установить в true, ширина компонента W автоматически подстраивается под самую длинную строку надписи. (По умолчанию - true). Да, да, надпись может иметь несколько строк. Разбиение на строки выполняется при помощи символа "\n".


X, Y - абсолютные координаты левого верхнего угла


 


Методы компонента (см. "кнопка")


Изменено пользователем Zer0Galaxy

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Окно ввода.



Edit1=Form1:addEdit(left,top,onEnter)

Команда создает на форма Form1 окно ввода и возвращает указатель на вновь созданный объект.


Окно ввода позволяет вводить с клавиатуры текст, ограниченный одной строкой.


 


Параметры вызова метода addEdit:


left,top - (числа) координаты левого верхнего угла окна относительно объекта которому принадлежит компонент.


onEnter - (функция) обработчик окончания ввода.


Левый щелчок мыши на окне переведет компонент в режим ввода текста. Завершение ввода осуществляется нажатием клавиши Enter. После чего вызывается функция-обработчик, если она определена. Функция принимает один параметр - указатель на компонент, который ее вызвал.


 


Дополнительные свойства:


W - ширина окна (по умолчанию - 20).


H - высота (по умолчанию - 3)


text - строка текста, введенного в окно ввода.


border - наличие рамки (по умолчанию - 1)


color - цвет фона (по умолчанию - 0x000000),


fontColor - цвет текста и рамки(по умолчанию - 0xffffff).


visible - имеет значение false, если компонент скрыт (по умолчанию - true)


X, Y - абсолютные координаты левого верхнего угла


 


Методы компонента (см. "кнопка")


Изменено пользователем Zer0Galaxy

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Рамка.



Frame1=Form1:addFrame(left,top,border)

Рамка не выполняет никаких действий, а просто служит элементом декора.


 


Параметры вызова метода addFrame:


left,top - (числа) координаты левого верхнего угла рамки относительно объекта которому принадлежит компонент.


border - (0, 1 или 2) по умолчанию - 1.


 


Дополнительные свойства:


W - ширина рамки (по умолчанию - 20).


H - высота (по умолчанию - 10)


color - цвет фона (по умолчанию - 0x000000),


fontColor - цвет рамки(по умолчанию - 0xffffff).


visible - имеет значение false, если компонент скрыт (по умолчанию - true)


X, Y - абсолютные координаты левого верхнего угла


 


Методы компонента (см. "кнопка")

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Список.

List1=Form1:addList(left,top,onChange)

Список - визуальный компонент, способный хранить множество элементов данных различного типа, подобно таблице в Луа. Каждому элементу (item) списка ставится в соответствие строка (line), посредством которой этот элемент отображается на экране компьютера.

 

Параметры вызова метода addList:

left,top - (числа) координаты левого верхнего угла относительно объекта которому принадлежит компонент.

onChange - (функция) обработчик события, когда пользователь выбирает при помощи ЛКМ какой либо элемент списка.

 

Дополнительные свойства:

W - ширина списка (по умолчанию - 20).

H - высота (по умолчанию - 10)

border - (0, 1 или 2) рамка, по умолчанию - 2

color - цвет фона (по умолчанию - 0x000000),

fontColor - цвет шрифта и рамки(по умолчанию - 0xffffff).

selCol - цвет фона выбранной строки списка (по умолчанию -0x0000ff)

selFont - цвет шрифта выбранной строки (по умолчанию - 0xffff00)

index - номер выбранного элемента списка

items - таблица, содержащая элементы списка

lines - таблица, содержащая строки, соответствующие элементам списка

visible - имеет значение false, если компонент скрыт (по умолчанию - true)

X, Y - абсолютные координаты левого верхнего угла

 

В дополнение к методам, присущим остальным компонентам (см. "кнопка"), список имеет следующие методы:

clear() - очищает список

insert([pos,]line,item) - вставляет в список в позицию pos элемент item с соответствующей ему строкой line. Все последующие элементы сдвигаются на единицу. Если параметр pos отсутствует, вставка осуществляется в конец списка.

sort([comp]) - производит сортировку списка по условию comp. Если параметр comp задан, то он должен быть функцией, принимающей три параметра: comp(list, i, j), где list - указатель на список, а i и j - номера элементов списка. Функция comp должна возвращать true, если элементы списка i и j в результате сортировки меняются местами.  Если параметр comp не задан, то сортировка производится по строкам lines в алфавитном порядке.

 

В ближайшем будущем ожидайте презентацию системы визуального программирования на основе библиотеки forms

Изменено пользователем Zer0Galaxy

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Как со списком работать? Нихрена не понятно, ни как вставить, ни как удалить, что за элемент, если он все равно текстовый?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Как со списком работать? Нихрена не понятно, ни как вставить, ни как удалить, что за элемент, если он все равно текстовый?

Видимо, читать Вы не умеете совершенно. Кому Зер0 писал — один крип только знает.

t.insert(shownLine, index) — вставить строку index, отображающуюся под индексом index.

Получение элемента — t.index

Удаление элемента — table.remove(t.lines, "test") table.remove(t.names, "test")

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Нету у него там такого, и что за t и t.names?

Как непонятно было, так и осталось, поч элемент представлен строкой и каким-то item?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Нету у него там такого, и что за t и t.names?

Как непонятно было, так и осталось, поч элемент представлен строкой и каким-то item?

Если Вы чайник и/или не умеете читать — пожалуйста, уйдите.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

 

 

Ты что-то говорил про TextEditor, он есть?

Да. Я совместил его с компонентом Edit. Если полю text компонента присвоить значение string, мы будем иметь однострочный редактор. Завершение редактирования осуществляется клавишей Enter.

Если размеры компонента сделать побольше, а полю text присвоить значение table, получим многострочный редактор. Клавиша Enter будет вставлять новую строку, а выход из редактирования - клавишей F10.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Как со списком работать? Нихрена не понятно, ни как вставить, ни как удалить, что за элемент, если он все равно текстовый?

Список это компонент, напоминающий lua-таблицу. Только визуализированный, т.е. имеющий некое представление на экране компьютера. Как и таблица, список может хранить элементы всех доступных в луа типов данных - числа, строки, таблицы, функции. Только, в отличии от таблицы, каждый элемент списка помимо собственно данных имеет строку при помощи которой данный элемент отображается.

Вставляются элементы в список при помощи метода insert. Методу insert необходимо передать три параметра:

 - числовой - позицию, в которую вставляется элемент (при этом все последующие элементы сдвинутся);

 - строковый - имя, под которым данный элемент будет отображаться;

 - произвольный тип - собственно элемент списка.

Если позиция вставляемого элемента пропущена, элемент будет вставлен в конец списка.

Пример заполнения списка разными типами данных:

function hello()
  print("Hello, world!")
end

List1=Form1:addList(5,5) -- создаем список
List1:insert("число",42) -- заполняем список
List1:insert("строка","string")
List1:insert("таблица",{1,2,3})
List1:insert("функция",hello)

Удаление данных из списка поэлементно не предусмотрено. Список очищается целиком при помощи метода clear

 

 

 

Если Вы чайник и/или не умеете читать — пожалуйста, уйдите.

Ну зачем же сразу так?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Сделал расширение для либы:

------------------Menu------------------
local TMenu=setmetatable({W=20, H=10, selColor=0x0000ff, sfColor=0xffff00,
  type=function() return "List" end},TComponent)
TList.__index=TList
 
function TMenu:paint()
gpu.setForeground(self.sfColor)
gpu.setBackground(self.selColor)
local items=self.items
local y=self.top-1
local x=self.left
for i=1,#items do
gpu.set(x,y+i,items[i].text)

end
end
 
function TMenu:touch(x, y, btn, user)
self:hide()
	self.items[y].func()
end
 
function TComponent:addMenu(left, top,items)
if(self.type()=="Button")then
  local obj={left=left, top=top, items=items}
  self:makeChild(obj)
  return setmetatable(obj,TMenu)
  end
end

В результате тестирования: не находит метод TComponent:addMenu. В чем проблема? Компонент делал по образцу из TList.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Сделал расширение для либы:

...

В результате тестирования: не находит метод TComponent:addMenu. В чем проблема? Компонент делал по образцу из TList.

Может быть проблема в этом?

TList.__index=TList  -- а должно быть TMenu.__index=TMenu

А что это за компонент Menu? Что он должен делать?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Это разворачивающееся меню, да, это была причина, но я ее заметил не сразу и исправил "не глядя", а кроме этого переместил объявление в начало, и думал ,что каким-то макаром это влияет))

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Сделал библиотеку внешне-расширяемой: создаем файлы в папке /lib/formsparts/ в них регистрируем новые компоненты обычным образом.http://pastebin.com/8nTiPLHc

Пример расширения: http://pastebin.com/VDd8eTdg

Буду позже добавлять различные расширения.

 

Добавил функционал выборочной загрузки расширений: файла, имена которых оканчиваются на "-" не будут загружаться.

Изменено пользователем SergOmarov

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Получается, уже существующие компоненты библиотеки можно разложить по разным файлам?

 

А зачем эти переменные делать глобальными?

_G.forms=forms
_G.TComponent=TComponent
_G.gpu=gpu

Что бы добавить новый компонент, создаешь файл в папке /lib/formsparts/ и перегружаешь комп. Кто будет добавлять компоненты динамически?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Хорошая идея, но я ее решаю по-другому: у меня есть функция require2, перегружающая библиотеку еще раз) Ее легко сделать самому, продублировав стандартную require и убрав проверку на загруженность...

Переменные в глобал ,чтобы регистрация компонента не отличалась от внутренней.

Изменено пользователем SergOmarov

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Присоединяйтесь к обсуждению

Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.

Гость
Ответить в тему...

×   Вы вставили отформатированное содержимое.   Удалить форматирование

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отобразить как ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.


×
×
  • Создать...