Pull to refresh

Ruby + Shoes = Миленький GUI

Reading time4 min
Views11K
Статья изначально публиковалась для личного блога, но думаю те кто начинают изучать Ruby, или просто хотят написать GUI к приложению сочтут ее полезной.

Вступлений не будет. Тема сегодня — Shoes. Такой небольшой kit, для создания GUI к приложениям на Ruby. Впервые я о нем них услышал, когда пытался понять, как сделать на руби нечто графическое. Ответ пришел сразу, причем в двух(а то и трех вариантах):

  • Qt
  • wxWidgets
  • Tk
  • Shoes


Посмотрел пункт первый, затем второй. Узнал, что множество из ныне живущих популярных GUI-приложений на C++ имеют под собой Qt-основу :) В общем, вызнал много полезного да и вообще позитивного. На шузы (нравится их так называть) я почти не смотрел, а зря.

Буквально через месяц случайно решил попробовать, и знаете, с помощьюю Shoes творить GUI в руби гораздо легче, чем использовать неродные Qt и пр.

Собственно, думаю, это будет первая статья из мелкого цикла. В ней медленно но верно буду описывать создание простеньких приложений, какие-либо детали и пр. Думаю будет интересно. Начнем мы с нечта тривиального, так что, вперед!

FTP-загрузчик файлов на сервер





А-ля проектирование


Что же нам нужно для нашего проекта? Вообще, я решил написать нечто простое; от программы нам понадобится следующее:

  • Возможность подключения к серверу
  • Отправка файла по заданному пути


Все это делается просто и быстро, поэтому приступам к делу, но для начала небольшое введение.

О Shoes



Скачать «это»: shoooes.net/downloads. Как только скачали создайте на рабочем столе ярлыки для «shoes.exe» и «shoes.exe –-package».

Статьи/Мануалы можно смотреть тут: help.shoooes.net. Но и в самом shoes.exe можно открыть оффлайн-мануал. Достаточно удобный и подробный.

Советую читать по мере необходимости все оттуда, ну и не забывать про то, что на сайте. По-моему, там информации больше таки.

Пишем GUI



То, что мы будем писать — обычный Ruby-код, завернутый в Shoes.app do … end блок. Self внутри которого, это и есть наш Shoes::App. Мы можем вызывать нужные методы, использовать var и прочие радости жизни. Как отделять код и наследоваться от этого класса я пока толком не понял, так что более сложные предложения проходили под брифом $shoes = self внутри блока шузов.

Среди множества положительных качеств всем по нраву будет — кросплатформенность. Один и тот же ruby-код будет работать в разных ОС, только вот выглядеть будет несколько по разному: help.shoooes.net/Introducing.html

Но вернемся к нашей задаче. Нам с Вами хочется написать загрузчик файлов на FTP-сервер. Для соединения с сервером будем использовать Net::FTP(ну вот так вот, из стандартного комплекта), а для GUI — сами_знаете_что.

Начинаем



Shoes.app(:title => 'FTP File Uploader', :width => 500, :height => 400, :resizable => false) do
require 'net/ftp'
background gradient rgb(255, 255, 255), rgb(150, 150, 150), :angle => 45

stack :margin => 20 do

end
end


Создаем наше приложение, задавая некоторые параметры:


:title — название
:width — ширина
:height — высота
:resizable — ресайз :-)


Затем подключаем в перспективе то, что нам понадобится на будущее для работы с FTP.
После этого делаем красивый фон градиентом под углом(почти как на человеческой языке говорить: “set background to gradient rbg rbg with angle”, ну или что-то такое).

Далее идет блок. В нем мы можем задать отступ от всего что вокруг(:margin). Кроме всего прочего элементы внутри stack будут располагаться друг под другом, в отличие от flow.

Добавляем элементы



Shoes.app(:title => 'FTP File Uploader', :width => 500, :height => 400, :resizable => false) do

require 'net/ftp'

background gradient rgb(255, 255, 255), rgb(150, 150, 150), :angle => 45

stack :margin => 20 do
caption 'FTP File Uploader'

flow :margin => 3 do
inscription 'FTP-server: '
@server = edit_line :width => 200
end

flow :margin => 3 do
inscription 'FTP-path: '
@path = edit_line :width => 200
end

flow :margin => 3 do
inscription 'Username: '
@username = edit_line :width => 200, :text => 'anonymous'
end

flow :margin => 3 do
inscription 'Password: '
@password = edit_line :width => 200, :secret => true
end

para

flow :margin => 3 do
inscription 'Filename: '
@filename = edit_line :width => 200
para ' '
button 'Browse...' do
@filename.text = ask_open_file
end
end

flow :margin => 3 do
@status = para ''
end

end
end


После того, как мы написали базу пора добавить немного элементов, да и вообще хоть чего-то более-менее живого добавить в приложение. Для этого используем flow, inscription(текст с размером 10px), para(тоже текст, только побольше), edit_line, button — элементы графического интерфейса.

Как уже писал, flow — тот-же блок stack, только элементы в нем будут идти друг за другом.

EditLine — поле ввода.

Inscription и para — текстовые блоки.

Button — банальная кнопка.

Теперь кое о чем подробнее. "@server = edit_line :width => 200" — т.к. в пределах всего блока Shoes.app, self — это и есть наше приложение, то мы можем работать с его св-и посредством @, таким образом помещая туда элементы, данные, что угодно и работая с ними внутри каких-либо наших конструкций.

Еще один момент, кнопки мы никак не называем, потому что описываем их действие сразу. Если к методу button добавить блок, то он выполнится при нажатии кнопки — удобно, согласитесь. Таким образом, при нажатии “Browse…” у нас откроется диалоговое окно(ask_open_file), и имя выбранного файла будет записано в наш edit_line.

Немного отвлекся. Нам ведь нужно посмотреть на плоды своего творчествава. Для этого запускаем Shoes.exe и выбираем «Open an App». Выбираем наш .rb файл и вуа-ля :)

Завершающий этап



Скриншот того, что получилось: http://jleft.ru/wp-content/uploads/2009/05/screen11.gif
Исходники в отдельном файле: http://www.sendspace.com/file/ba7lkl

Shoes.app(:title => 'FTP File Uploader', :width => 500, :height => 400, :resizable => false) do

require 'net/ftp'

background gradient rgb(255, 255, 255), rgb(150, 150, 150), :angle => 45

stack :margin => 20 do
caption 'FTP File Uploader'

flow :margin => 3 do
inscription 'FTP-server: '
@server = edit_line :width => 200
end

flow :margin => 3 do
inscription 'FTP-path: '
@path = edit_line :width => 200
end

flow :margin => 3 do
inscription 'Username: '
@username = edit_line :width => 200, :text => 'anonymous'
end

flow :margin => 3 do
inscription 'Password: '
@password = edit_line :width => 200, :secret => true
end

para

flow :margin => 3 do
inscription 'Filename: '
@filename = edit_line :width => 200
para ' '
button 'Browse...' do
@filename.text = ask_open_file
end
end

flow :margin => 3 do
button 'Upload' do
@status.text = ''
begin
Net::FTP.open(@server.text) do |ftp|
ftp.login(@username.text, @password.text)
ftp.chdir(@path.text)
ftp.putbinaryfile(@filename.text)
end
@status.text = 'File transfered'
rescue Exception => e
alert "Error: #{e}"
end
end
end

flow :margin => 3 do
@status = para ''
end

end
end


Если чего не дописал/неверно — напишите, поправим-с. :)

UPD. Перенес в блог Ruby
Tags:
Hubs:
Total votes 38: ↑37 and ↓1+36
Comments29

Articles