Декларативные описания GUI (XML)
От: fuxx Россия  
Дата: 20.04.05 11:46
Оценка: 41 (3)
Кто пользуется такими штуками?
Вот (далеко не полный) список:

Microsoft Avalon, XAML используют XML
Mozilla XUL исользует XML
Adobe Adam&Eve не используют XML
Apple Cocoa Bindings
Eclipse RCP
http://www.swixml.org — Java, Swing, XML
http://swingml.sourceforge.net — Java, Swing, XML

хотелось бы обсудить легкость программирования, легкость создания интерфейса, портабельность, просто личные впечатления...
Сергей
Re: Декларативные описания GUI (XML)
От: c-smile Канада http://terrainformatica.com
Дата: 25.04.05 15:56
Оценка:
Здравствуйте, fuxx, Вы писали:

Ты забыл про просто HTML.
Как средство layout он работает хорошо.

Вот кстати мой новый проект: Harmonia project —
UI framework для D который включает HTML engine (Open Source).


Само демо здесь

Вот так выглядит этот demo внутри:

import harmonia.ui.application;
import harmonia.ui.window;
import harmonia.ui.widget;
import harmonia.ui.events;
import harmonia.ui.controls.editbox;
import harmonia.ui.controls.scrollbar;
import harmonia.ui.controls.listbox;
import harmonia.ui.controls.buttons;
import harmonia.html.view;
import harmonia.gx.images;

//|
//| static module ctor
//|
//| Harmonia way to setup GUI application
//| 

static this() 
{
  Application.onStart = 
    // Runtime started. Statics were intitalized.
    // Voulez-vous dancer? 
    function void() 
    { 
      // create MainWindow here
      (new MyWindow()).state = Window.STATE.SHOWN;
    };

  Application.onStop = 
    // All windows closed so do graceful quit.
    function void() 
    { 
      // close files, etc.
    };
}


class MyWindow: Window 
{
  Image     im;
  HtmlPanel hp;

  static Command cmdTest;
  static this()
  {
    cmdTest = new Command("test", "Test", "Tests command button");
  }

  this() 
  {
    // button on top left corner
      Button b = new CommandButton(cmdTest);
      this ~= b;
      b.place = rect(10,10,80,30);
      
    // listbox below
      ListBox lb = new ListBox();
      this ~= lb;
      lb.place = rect(10,40,80,140);
      
    // fill it by items
      static string[] items =
      [
        "One",
        "Two",
        "Three",
        "Four",
        "Five",
        "Six Six Six Six Six Six Six Six",
        "Seven",
        "Eight",
      ];
      lb.addItems( items );

    // HTML panel  
      hp = new HtmlPanel();
      this ~= hp;

      hp.load
("<HTML>
  <H1 padding=3px back-color='edit dialog'>H1:This is <I>HTML text</I> &nbsp;loaded into <B>HTMLPanel</B> - simple non scrollable HTML container.</H1>
  <P>Inline image:<IMG src='test.png'/> and <CODE> code example; </CODE></P>
  <P height=100% padding=10pt border-width=3px border-style='solid none none none' border-color=dialog-shadow >
    This paragraph declared as <CODE>&lt;P height=100%&gt;</CODE>. This means that it will take 100% of height left from other elements.
    This is a major difference from standard HTML - percents here are <I>percents from free space</I>.
    <BR/>Notice 3 pixel bar at the left side - it is left border of the paragraph. Such percents are used instead of flex'es in XUL.</P>
  <TABLE cellspacing=10px cellpadding=10px padding=10px border-width=1px border-style=solid border-color=dialog-shadow >
    <TR>
    <TD width=30%>Inline editbox: <INPUT type=text value='hello world' width=100px />
and button:<INPUT type=button value='button' width=60px />
and combobox:
<INPUT type=select width=60px>
        <OPTION>One</OPTION>
        <OPTION>Two</OPTION>
        <OPTION>Three</OPTION>
        <OPTION>Four</OPTION>
        <OPTION>Five</OPTION>
        <OPTION>Six Six Six Six Six Six Six Six</OPTION>
        <OPTION>Seven</OPTION>
        <OPTION>Eight</OPTION>
        <OPTION>Nine</OPTION>
        <OPTION>Ten</OPTION>
</INPUT>
</TD>
      <TD>two</TD>
      <TD width=40 back-color='dialog-light scrollbar' border='1px solid dialog-shadow'>1</TD>
    </TR>
    <TR>
      <TD border='1px solid dialog-shadow' text-align=right>right aligned cell with border</TD>
      <TD>four</TD>
      <TD back-color='dialog-light scrollbar' border='1px solid dialog-shadow'>2</TD>
    </TR>
    <TR>
      <TD colspan=2 back-color='dialog-light dialog-shadow'>colspan=2, table cells with gradient backgrounds</TD>
      <TD back-color='dialog-light dialog-light scrollbar dialog-shadow'>3</TD>
    </TR>
  </TABLE>
  <P>Hyperlink test: <A href='http://terrainformatica.com'>Terra Informatica</A></P>
</HTML>"); 

      hp.place = rect(100,10,220,300);
      im = Image.load("pngtest.png");
      //assert(im !== null);

  }

  override void drawContent(Graphics g)
  {
      super.drawContent(g);
      if(im !== null)
      {
        // draw the Bird - PNG with alpha
        auto Graphics ig = new Graphics(im);
        rect  src = rect(im.dimension);
        point dst = place.pointOf(9); // top right corner, see NUM keypad why 9
              dst.x -= im.dimension.x;
        g.copyRect(dst,src,ig);
      }
  }

  override void doLayout()
  {
     rect r = hp.place;
     r.corner = place.corner - 10;
     hp.place = r;

  }

  bool on(EventCommand evt)    
  { 
    if(evt.cmd is cmdTest && evt.exec)    
    {
      Window popw = new Window(TYPE.POPUP, this);
      popw.state = STATE.SHOWN;
      return true;   
    }
    return false; 
  } // return true to stop traversing

}
Re: Декларативные описания GUI (XML)
От: Mamut Швеция http://dmitriid.com
Дата: 26.04.05 07:16
Оценка: 11 (3)
Еще в Qt можно загружать виджеты, описанные в .ui (Qt XML формат). Описывается очень большое количество вещей — layout, actionsm signals/slots, properties, embedded images, member functions, member variables, menubars, toolbars, tabstops

Например, наипростейший виджет:



<!DOCTYPE UI><UI version="3.3" stdsetdef="1">
<class>MyWidget</class>
<widget class="QWidget">
    <property name="name">
        <cstring>MyWidget</cstring>
    </property>
    <property name="geometry">
        <rect>
            <x>0</x>
            <y>0</y>
            <width>387</width>
            <height>228</height>
        </rect>
    </property>
    <property name="caption">
        <string>Form1</string>
    </property>
    <hbox>
        <property name="name">
            <cstring>unnamed</cstring>
        </property>
        <property name="margin">
            <number>11</number>
        </property>
        <property name="spacing">
            <number>6</number>
        </property>
        <widget class="QTextBrowser">
            <property name="name">
                <cstring>TextBrowser1</cstring>
            </property>
            <property name="text">
                <string>This is a &lt;b&gt;simple&lt;/b&gt; widget. It contains a simple layout (HBox) and a QSimpleRichText</string>
            </property>
        </widget>
    </hbox>
</widget>
<layoutdefaults spacing="6" margin="11"/>
</UI>



Для работы с виджетом возможны два подхода.

Первый — с помощью утилиты uic этот самый .ui файл трансформируется в связку .cpp/.h файлов, который можно подключить к проекту. Это самый стандартный способ.

Второй — работать с файлом напрямую. Например:

QWidget *widget = (QWidget *)QWidgetFactory::create( "../mywidget.ui" );

widget -> show();

QTextBrowser *rt = (QTextBrowser *) widget->child( "TextBrowser1", "QTextBrowser" );
if ( rt )
    rt->setText( "text" );
... << RSDN@Home 1.1.4 beta 6 rev. 433>>


dmitriid.comGitHubLinkedIn
Re[2]: Декларативные описания GUI (XML)
От: AndrewVK Россия http://blogs.rsdn.org/avk
Дата: 27.04.05 13:10
Оценка: +4
Здравствуйте, c-smile, Вы писали:

CS>Вот кстати мой новый проект: Harmonia project -

CS>UI framework для D который включает HTML engine (Open Source).

Ты бы лучше на дотнет портанул — отклик был бы куда больше ИМХО.
... << RSDN@Home 1.1.4 beta 6 rev. 430>>
AVK Blog
Re[2]: Декларативные описания GUI (XML)
От: AndrewVK Россия http://blogs.rsdn.org/avk
Дата: 27.04.05 13:10
Оценка:
Здравствуйте, Mamut, Вы писали:

M>Еще в Qt можно загружать виджеты, описанные в .ui (Qt XML формат).


Ну тогда еще есть джавовский LTP (Long Term Persistence).
... << RSDN@Home 1.1.4 beta 6 rev. 430>>
AVK Blog
Re[3]: Декларативные описания GUI (XML)
От: c-smile Канада http://terrainformatica.com
Дата: 16.05.05 20:14
Оценка:
Здравствуйте, AndrewVK, Вы писали:

AVK>Ты бы лучше на дотнет портанул — отклик был бы куда больше ИМХО.


Теоретически возможно, но скорее всего не будет настолько эффективно.

По поводу отклика .NET сомневаюсь.
Под D и C++ у меня есть реальные коммерческие заказы/проекты.
Под .NET (по опыту HTMLayout) реальных и серьезных заказов/проектов нет.
75% просят голый C интерфейс. 25% ActiveX.
Такова объективная реальность на сегодняшний день. .NET общественность
скорее вего сейчас в UI не вкладывается в свете Авалона и всего остального.
Re[4]: Декларативные описания GUI (XML)
От: AndrewVK Россия http://blogs.rsdn.org/avk
Дата: 17.05.05 09:08
Оценка: +1
Здравствуйте, c-smile, Вы писали:

CS>Теоретически возможно, но скорее всего не будет настолько эффективно.


А оно надо? В смысле эффективно? Современные машинки давно уже научились выводить GUI очень быстро. Не думаю что замедление твоего кода даже на 50% существенно скажеться на пользовательских характеристиках.

CS>Такова объективная реальность на сегодняшний день. .NET общественность

CS>скорее вего сейчас в UI не вкладывается в свете Авалона и всего остального.

Как представитель этой самой общественности могу сказать — это не так.
... << RSDN@Home 1.1.4 beta 7 rev. 455>>
AVK Blog
Re[5]: Декларативные описания GUI (XML)
От: c-smile Канада http://terrainformatica.com
Дата: 18.05.05 03:16
Оценка:
Здравствуйте, AndrewVK, Вы писали:

AVK>Здравствуйте, c-smile, Вы писали:


CS>>Теоретически возможно, но скорее всего не будет настолько эффективно.


AVK>А оно надо? В смысле эффективно? Современные машинки давно уже научились выводить GUI очень быстро. Не думаю что замедление твоего кода даже на 50% существенно скажеться на пользовательских характеристиках.


А я не знаю как оно надо. Я делаю по максимуму.
Т.е. быстрее можно сделать чтобы работало но не сильно.

CS>>Такова объективная реальность на сегодняшний день. .NET общественность

CS>>скорее вего сейчас в UI не вкладывается в свете Авалона и всего остального.

AVK>Как представитель этой самой общественности могу сказать — это не так.


Ну дык зачем вообще дело стало? У меня самого времени нет .
Если есть желющие — скажите — я открою svn под проект (если надо)
и чем смогу — помогу.
Так же в принципе можно написать порт на C++ (Бьярн оченно хочет
унифицированный GUI для C++0x)...
Re[6]: Декларативные описания GUI (XML)
От: AndrewVK Россия http://blogs.rsdn.org/avk
Дата: 18.05.05 10:03
Оценка: +3
Здравствуйте, c-smile, Вы писали:

CS>А я не знаю как оно надо. Я делаю по максимуму.


Это плохо.

CS>Т.е. быстрее можно сделать чтобы работало но не сильно.


А оно нужно, быстрее?

AVK>>Как представитель этой самой общественности могу сказать — это не так.


CS>Ну дык зачем вообще дело стало? У меня самого времени нет .


У меня тоже.

CS>Если есть желющие — скажите — я открою svn под проект (если надо)

CS>и чем смогу — помогу.

Ну так напиши призыв. А svn под проект мы и сами откроем. Даже форум сделаем.
... << RSDN@Home 1.1.4 beta 7 rev. 455>>
AVK Blog
Re: Декларативные описания GUI (XML)
От: Stoune  
Дата: 04.11.05 23:09
Оценка:
Здравствуйте, fuxx, Вы писали:

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

wxWidget забыл, XRC-формат, пока местами сыровато, но по сравнению с тем же XUL рантайм значительно меньше.
... << RSDN@Home 1.1.4 stable SR1 rev. 568>>
Re[2]: Декларативные описания GUI (XML)
От: vladserge Россия  
Дата: 05.11.05 07:15
Оценка: 6 (1) +1 -2
Здравствуйте, c-smile, Вы писали:

CS>Вот так выглядит этот demo внутри:


CS>
......
......

......
CS>      hp.load
CS>("<HTML>
CS>  <H1 padding=3px back-color='edit dialog'>H1:This is <I>HTML text</I> &nbsp;loaded into <B>HTMLPanel</B> - simple non scrollable HTML container.</H1>
CS>  <P>Inline image:<IMG src='test.png'/> and <CODE> code example; </CODE></P>
CS>  <P height=100% padding=10pt border-width=3px border-style='solid none none none' border-color=dialog-shadow >
CS>    This paragraph declared as <CODE>&lt;P height=100%&gt;</CODE>. This means that it will take 100% of height left from other elements.
CS>    This is a major difference from standard HTML - percents here are <I>percents from free space</I>.
CS>    <BR/>Notice 3 pixel bar at the left side - it is left border of the paragraph. Such percents are used instead of flex'es in XUL.</P>
CS>  <TABLE cellspacing=10px cellpadding=10px padding=10px border-width=1px border-style=solid border-color=dialog-shadow >
CS>    <TR>
CS>    <TD width=30%>Inline editbox: <INPUT type=text value='hello world' width=100px />
CS>and button:<INPUT type=button value='button' width=60px />
CS>and combobox:
CS><INPUT type=select width=60px>
CS>        <OPTION>One</OPTION>
CS>        <OPTION>Two</OPTION>
CS>        <OPTION>Three</OPTION>
CS>        <OPTION>Four</OPTION>
CS>        <OPTION>Five</OPTION>
CS>        <OPTION>Six Six Six Six Six Six Six Six</OPTION>
CS>        <OPTION>Seven</OPTION>
CS>        <OPTION>Eight</OPTION>
CS>        <OPTION>Nine</OPTION>
CS>        <OPTION>Ten</OPTION>
CS></INPUT>
CS></TD>
CS>      <TD>two</TD>
CS>      <TD width=40 back-color='dialog-light scrollbar' border='1px solid dialog-shadow'>1</TD>
CS>    </TR>
CS>    <TR>
CS>      <TD border='1px solid dialog-shadow' text-align=right>right aligned cell with border</TD>
CS>      <TD>four</TD>
CS>      <TD back-color='dialog-light scrollbar' border='1px solid dialog-shadow'>2</TD>
CS>    </TR>
CS>    <TR>
CS>      <TD colspan=2 back-color='dialog-light dialog-shadow'>colspan=2, table cells with gradient backgrounds</TD>
CS>      <TD back-color='dialog-light dialog-light scrollbar dialog-shadow'>3</TD>
CS>    </TR>
CS>  </TABLE>
CS>  <P>Hyperlink test: <A href='http://terrainformatica.com'>Terra Informatica</A></P>
CS></HTML>"); 

CS>      hp.place = rect(100,10,220,300);
CS>      im = Image.load("pngtest.png");
CS>      //assert(im !== null);

CS>  }

.....
.....

CS>


посмотрел и ужаснулся, а чего хорошего то ?
Тут MS гордится тем что в ASP.NET отделили код от дизайна. А тут что мы видим? Назад в будущее?
Объясните мне, неразумному, чего хорошего в этом подходе? Хочется динамически менять внешний вид?
ну так что мешает динамически менять исходники, компилить полученное и отправлять клиенту?

только не надо про то, что при таком подходе, я возьму блокнот и будет счастие без перекомпиляции.
хочу какой нибудь убийственный пример где приведенная система однозначно рулит.
С Уважением Сергей Чикирев
Re: Декларативные описания GUI (XML)
От: nzeemin Россия http://nzeemin.livejournal.com/
Дата: 07.11.05 07:11
Оценка:
Здравствуйте, fuxx, Вы писали:

F>Кто пользуется такими штуками?

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

Есть еще такой UIX (UI XML) от Oracle, идёт в составе JDeveloper 9.x.
Это XML-ное описание веб-форм со множеством уже готовых контролов, причём не только тривиальных типа поля или кнопки, но и деревья, закладки, бороды и много чего ещё.

Программировал в этом счастье примерно 8 месяцев. Ощущения такие. Работает. Местами даже очень удобно. Есть визуальный редактор, который практически сразу был выброшен на помойку — JDeveloper это не Eclipse, подтормаживает весьма ощутимо (иногда всё замирает на несколько секунд), на действиях в редакторе это сказывается очень существенно. Поэтому всё делалось руками прямо в XML. Вполне удобно писать. Самое главное НО: пока ты остаёшся в рамках имеющихся контролов — всё нормально. Свои контролы написать — очень трудно. Т.е. расширяемость крайне слабая.
Re: Декларативные описания GUI (XML)
От: MaxxK  
Дата: 07.11.05 12:00
Оценка:
Здравствуйте, fuxx, Вы писали:

F>Кто пользуется такими штуками?


Я сейчас играюсь с XAML, другие не пробовал, так что сравнить не могу.

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


Мне понравилось. Проще создавать стало. Правда, т.к. это еще CTP, тяжеловато разбираться и связывать интерфейс с кодом. Документация неполная, примеров мало (из которых половина не работает). Но для меня у XAML есть один очень большой плюс: можно "нарисовать" окно где угодно, хоть в блокноте. Не так много тегов и свойств, реально запомнить. Дизайнерами я не пользовался, но мне такой способ создания (руками) понравился даже больше, чем дизайнер WinForms в VS2005...
Re[3]: Декларативные описания GUI (XML)
От: Аноним  
Дата: 07.11.05 15:25
Оценка:
Здравствуйте, vladserge, Вы писали:

V>посмотрел и ужаснулся, а чего хорошего то ?

V>Тут MS гордится тем что в ASP.NET отделили код от дизайна. А тут что мы видим? Назад в будущее?
V>Объясните мне, неразумному, чего хорошего в этом подходе? Хочется динамически менять внешний вид?
V>ну так что мешает динамически менять исходники, компилить полученное и отправлять клиенту?

V>только не надо про то, что при таком подходе, я возьму блокнот и будет счастие без перекомпиляции.

V>хочу какой нибудь убийственный пример где приведенная система однозначно рулит.

У меня есть подозрение, что это всё можно подгружать из просто файла, а не прописывать в коде. Вот и без перекомпиляции. А микрософт вообще ничего не придумывает...
Re[4]: Декларативные описания GUI (XML)
От: vladserge Россия  
Дата: 08.11.05 11:29
Оценка:
Здравствуйте, Аноним, Вы писали:


А>У меня есть подозрение, что это всё можно подгружать из просто файла, а не прописывать в коде. Вот и без перекомпиляции. А микрософт вообще ничего не придумывает...


а перекомпиляция это такой вред организму? ну, перекомпиляция, если нужно в автоматическом режиме. что плохого?
С Уважением Сергей Чикирев
Re[5]: Декларативные описания GUI (XML)
От: Kingofastellarwar Украина  
Дата: 31.10.08 20:43
Оценка:
Хочу разобраться с XRC но вот не могу понять, он что без сайзеров не бывает? Почему-то ни в одном редакторе не нашёл как задать абсолютное положение контрола на форме такое чувство что это у них идеология такая да?
Я изъездил эту страну вдоль и поперек, общался с умнейшими людьми и я могу вам ручаться в том, что обработка данных является лишь причудой, мода на которую продержится не более года. (с) Эксперт, авторитет и профессионал из 1957 г.
Re[2]: Декларативные описания GUI (XML)
От: mishaa Россия http://kmmbvnr.livejournal.com
Дата: 01.11.08 05:12
Оценка:
Здравствуйте, MaxxK, Вы писали:

MK>Мне понравилось. Проще создавать стало. Правда, т.к. это еще CTP, тяжеловато разбираться и связывать интерфейс с кодом. Документация неполная, примеров мало (из которых половина не работает). Но для меня у XAML есть один очень большой плюс: можно "нарисовать" окно где угодно, хоть в блокноте. Не так много тегов и свойств, реально запомнить. Дизайнерами я не пользовался, но мне такой способ создания (руками) понравился даже больше, чем дизайнер WinForms в VS2005...


Продолжая мыслю, еще лучше оказывается не в блокноте, а в нормальной среде, с подсветкой, автокомплитом, и детектирования ошибок на лету. И более того лучше даже не на XML, а на достаточно выразительном языке программирования
-- Главное про деструктор копирования не забыть --
 
Подождите ...
Wait...
Пока на собственное сообщение не было ответов, его можно удалить.