Translate

четверг, 14 июня 2012 г.

Программирование под android. Полезный инструмент для автоматизации проектирования интерфейса

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


  Обосную: мы не можем напрямую в XML задать размер компонента в процентах относительно размера экрана. Поэтому, если мы хотим сделать, например, кнопку, длиной равно в половину экрана, придется либо извращаться либо создавать компоненты напрямую в коде.
  Второе не очень приятно, поскольку код забивается совершенно ненужными - "мусорными" - инструкциями - очень неприятно смотреть на однообразный код создания интерфейса в Activity

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

  Собственно, пост и представляет собой документацию мною написанной опенсорсной системы для проектирования интерфейса в android приложениях.


  Итак, образец записи в строковом ресурсе:

  <string name="gui">
      Text/t1-N/15,0-22,10;
      Text/t2-X/47,0-55,10;
      Text/t3-Y/80,0-88,10;
      Edit/field1-/0,10-33,20;
      Edit/field2-/33,10-66,20;
      Edit/field3-/66,10-100,20;
      Button/add-Добавить точку/0,20-50,30;
      Button/clear-Сбросить/50,20-100,30;
      Text/info-/0,30-100,60;
      Edit/n1-/10,60-30,70;
      Edit/n2-/40,60-60,70;
      Text/t4-От/0,60-10,70;
      Text/t5-До/30,60-40,70;
      Button/s-Найти расстояние/60,60-100,70;
      Edit/an1-/0,70-22,80;
      Edit/an2-/22,70-44,80;
      Edit/an3-/44,70-66,80;
      Button/an-Найти угол/66,70-100,80;
      Text/res-Результат/0,85-100,95
      @
    </string>

Вот как выглядит этот интерфейс:



   Каждая строка - отдельный компонент. Строки разделяются точкой с запятой. Внимание: в последней строке точка с запятой не ставится, зато ставится @ в самом конце записи.

   Каждая строка распадается на члены, разделенные слешами. Значения каждого из членов:
- первый: класс компонента. Может быть Text(TextView), Edit(EditText), Button.
- второй: наименование и (через тире) текст на компоненте по умолчанию. Будет использоваться для обращения к компоненту
- третий: кординаты. Задаются координаты верхнего левого и нижнего правого углов компонента в процентах от размеров экрана.

  Итак, как же с этим работать:

1)Унаследовать свою activity от GIUActivity

2)Проинициализировать GUI из строки:
super.Init(getString(R.string.gui));

3)Обращатся к компонентам:
gui.getText(<имя>)
gui.setText(<имя>,<текст>)

gui.setX("<имя>, 5);
gui.setHeight(<имя>,40);
gui.setY(<имя>,20);
gui.setWidth(<имя>,95);

 В классе GIU можно написать кучу методов по аналогии с кодом, представленном в нем.

 Скачать систему проектирования интерфейса

Скачать пример использования системы

Комментариев нет:

Отправить комментарий

Related Posts Plugin for WordPress, Blogger...