Arduino.ru

PS

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

Кажется оно http://www.sojamo.de/libraries/controlP5/

Круто, спасибо! то что нужно!

Вот только еще такой вопрос: если есть дизайн интерфейса например в psd, то как его сверстать для программы? Т.е. можно ли собирать дизайн из векторных элементов (как верстка сайта) или все задается только формулами и координатами?

Понятия не имею, меня именно это от processing и отпугивает.

Сам использую Delphi.

UPD. http://www.lagers.org.uk/g4ptool/index.html - вроде оно.

UPD2. проверил - всё работает, правда тормознуто :( (по крайней мере у меня)

А я Python использую, потому что кросплатформеный(по сравнению с Delphi) и набор виджетов GTK2 - библиотека PyGTK(под 7 виндой очень даже прилично смотрится), есть визуальный дизайнер Glade.

Потому что в убунте Python по умолчанию установлен. И со строками в питоне проще работать. И код всега четко отформатирован )))(иначе не работает)

Единственный минус что библиотека достаточно много весит, но можно же просто дать ссылку на установку - вобщем чем-то похож на .NET

Спасибо, G4P действительно можно редактировать, но на уровне размера и цвета элементов.. 

Питон, равно как и делфи это все-таки новые языки.. к процессингу уже чуток привык (из Ардуины).

Впринципе в библиотеке ControlP5 например можно задать картинку кнопке, но только растровое изображение, не векторное, это вопервых, а во вторых: если задать изображение круглой кнопки, то она все равно обрабатывается как квадратная (т.е. если вписать этот круг в воображаемых квадрат и нажать на угол, где кнопки как бы нет, все равно обрабатывается нажатие) - как это борот пока не знаю.

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

Все-таки ведь при разработке программ для мобильных например, дизайнер рисует интерфейсы в Иллюстраторе и затем эти элементы интерфейса как-то верстаются в программе.. 

В процессинге я для этих целей пока что нашел функцию LoadShape() которая подгружает файлы .svg (описание)

Но к сожалению использовать эту функцию внутри библиотеки ControlP5 не смог.

UPD

на забугорном форуме мне ответили так:

"Draw your shapes in PGraphics off-line images, then you can use them in ControlP5."

Смысл понял только до того места, что нужно как-то использовать класс PGraphics, но практическое применение данного, пока не постиг...

Эта проблема всегда решалась созданием своего собственного элемента, который выглядит и выполняет те же функции, что и кнопка. То есть создание своей собственной кнопки.

Откуда Вы взяли файлик *.SVG?

.SVG это формат векторной графики, взял из Adobe illustrator  ... точнее сказать на форуме дали ссылку на описание функции LoadShape которая может загружать 2 типа векторых изображений: svg и obj

Поскольку Adobe illustrator не умеет сохранять в obj то выбирать особо не приходилось.

"Loads geometry into a variable of type PShape. SVG " - загружает svg типа Pshape

"Draw your shapes in PGraphics off-line images, then you can use them in ControlP5."

Подозреваю что оно ест SVG файлики только те, которые были созданы с помощью PGraphics.

Вот тут то как раз сложный момент для моего понимания:

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

Понятно, что можно создать что-то вроде circle с заданными параметрами, но что если мне нужен не просто круг, а элемент с тенями бликами и текстом?

Рисовать его полсотней строк кода?   Хотелось бы взять готовый векторный элемент и перенести в программу, а там уже оживить.

Вобщем у меня получилось задать векторное изображение кнопке в библиотеке ControlP5, подсказали вот такой код:

import controlP5.*;
// this example used processing 2.0 and controlP5 2.0.4
ControlP5 cp5;
 
void setup() {
  size(400, 400);
  cp5 = new ControlP5(this);
  // create a new custom Button that excepts a shape
  MyButton b = new MyButton(cp5, "test", loadShape("bot.svg") );
  // set some parameters for our custom Button
  b.setSize(50, 50).setPosition(100, 200);
}
 
void draw() {
  background(128);
}
 
 
// create a custom Button and inherit all properties and behavior 
// from it's super class
 
class MyButton extends Button {
 
  MyButton(ControlP5 c, String theName, final PShape s ) {
    super(c, theName);
    // ControllerViews are used to render a controller, since we
    // need a custom view to render the svg shape we need to override
    // the existing view with setView(ControllerView)
    setView(new ControllerView() {
 
      public void display(PApplet p, Object o) {
        if (isInside) {
          // if the mouse is detected inside our intersection area,
          // rotate the shape by 90 degrees.
          p.translate(getWidth()/2, getHeight()/2);
          p.rotate(HALF_PI);
          p.translate(-getWidth()/2, -getHeight()/2);
        }
        p.shape(s, 0,0, getWidth(), getHeight());
      }
    }
    );
  }
 
  // override the inside( ) function which by default evaluates 
  // intersections against rectangular areas. Here though we need
  // a circular area which we implement with dist() below.
  public boolean inside() {
    float x = _myParent.getAbsolutePosition( ).x + position.x + getWidth()/2;
    float y = _myParent.getAbsolutePosition( ).y + position.y + getHeight()/2;
    return dist(x, y, mouseX, mouseY)<getWidth()/2;
  }
}

но обрабатывается она по прежнему также криво, как и растровое изображение.

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

К сожалению, пока порывшись в файлах библиотеки не нашел того сокрального места где же все-таки отрисовывается эта самая форма того или иного элемента.

"Понятно, что можно создать что-то вроде circle с заданными параметрами, но что если мне нужен не просто круг, а элемент с тенями бликами и текстом?"

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

"Рисовать его полсотней строк кода?   Хотелось бы взять готовый векторный элемент и перенести в программу, а там уже оживить."

Есть такие штуки - называются классы. Создаете той же полсотней строк кода класс(например ромбовидная кнопка). Создаете несколько объектов и присваиваете им этот класс - и эти объекты превращаются в кнопки(при том же размере в полсотни строк на все кнопки).

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