Урок 10
На этом уроке мы изучим работу с анимацией и кастомными компонентами
Постановка задачи (задание урока)
Нужно описать экраны на которых реализована анимация переходов, кастомный компонент.
Их дизайн приведен на следующих рисунках:
На рисунке 1 изображен экран ANIMATION с множеством кнопок для разных типов анимации.
Описание экранов:
fragment(ANIMATION, R.layout.fragment_anim)
.navigator(handler(R.id.back, VH.OPEN_DRAWER),
handler(R.id.alpha_0, alpha(R.id.my, 0.5f, 500)),
handler(R.id.alpha_1, alpha(R.id.my, 1f, 500)),
handler(R.id.scale_0, scale(R.id.my, -0.5f, -0.5f, 500)),
handler(R.id.scale_1, scale(R.id.my, 0.5f, 0.5f, 500)),
handler(R.id.transl_0, translation(R.id.my, 24, 24, 500)),
handler(R.id.transl_1, translation(R.id.my, -24, -24, 500)),
handler(R.id.set_0, set(alpha(R.id.my, 0.5f, 500),
rotate(R.id.my, 90f, 500),
scale(R.id.my, -0.5f, -0.5f, 500),
translation(R.id.my, 24, 24, 500))),
handler(R.id.set_1, set(alpha(R.id.my, 1f, 500),
rotate(R.id.my, -90f, 500),
scale(R.id.my, 0.5f, 0.5f, 500),
translation(R.id.my, -24, -24, 500))))
.component(MyComponent.class, model(JSON, "{\"my\":\"WOOO DePro\"}"),
view(R.id.my), navigator(show(R.id.panel)));
А теперь объясним те новые конструкции, которые были использованы при его описании.
Объяснение работы новых компонентов
Экран ANIMATION
Анимация задается в навигаторе. Общий вид обработчика следующий: handler(R.id.view, метод_анимации(R.id.view_объекта _анимации, значение, [значение_2,] длительность)). Метод_анимации может быть: alpha (изменение прозрачности), scale (изменение масштаба), rotate (поворот вокруг центра), translation (перемещение), set (совокупность отдельных анимаций). View_объекта задает id элемента у которого анимируются свойства. Значение и значение_2 конечные значения параметра анимации. При этом значение_2 указывается для методов у которых изменяются параметры по осям x и y. Длительность - время изменения параметра в милисекундах.
Более подробная информация об анимации в библиотеке декларативного программирования DePro приведена в разделе"Анимация в DePro"
Кастомный компонен задается методом component(). Он аналогичен стандартному с одни отличием. Вместо типа компонента указывается класс кастомного компонента:
.component(MyComponent.class, model(JSON, "{\"my\":\"WOOO DePro\"}"),
view(R.id.my), navigator(show(R.id.panel)))
Параметры model, view и navigator описываются стандартно.
Написание кастомного компонента также не очень сложное. Ниже приведена программа простого компонента, который должен для всех сосотавляющих элемента указанного в методе view() присвоить (по названию) значения полученные по модели и привязать к ним обработчики навигатора.
public class MyComponent extends BaseComponent {
@Override
public void initView() {
componentTag = "MY_COMPONENT_";
viewComponent = null;
if (paramMV.paramView != null || paramMV.paramView.viewId != 0) {
viewComponent = parentLayout.findViewById(paramMV.paramView.viewId);
}
if (viewComponent == null) {
iBase.log("Не найдена View для MyComponent в " + multiComponent.nameComponent);
return;
}
}
@Override
public void changeData(Field field) {
if (field != null) {
workWithRecordsAndViews.RecordToView((Record) field.value, viewComponent, this, clickView);
}
}
}
Класс должен наследоваться от BaseComponent. У него должны быть обязательные методы: initView и changeData. В нашем случае в методе initView мы переменную viewComponent связываем с элементом разметки, указанным в методе view описания. В методе changeData мы связываем данные типа Field с viewComponent. Связывание осуществляется методом RecordToView. Он же привязывет к заданным элементам обработку навигатора. Параметр clickView - это метод BaseComponent в котором осуществляетсмя обработка навигатора.
В нашем случае данные поступают с JSON строки, а в качестве элемента куда эти данные заносятся служит обычный TextView. Можете поэкспериментировать как с моделью, так и с view. Например, можете в качестве view задать какой нибудь лайаут, а в нем разные элементы: TextView, ImageView. Данные можете задавать как в JSON строке, так и в URL.
Более подробная информация о написании кастомных компонентов в библиотеке декларативного программирования DePro приведена в разделе"Дополнительный материал"
Если все было сделано правильно, то после запуска приложения будет работать весь функционал
На этом описание уроков окончено. Более полно с декларативным программированием можно познакомиться в следующем разделе "Описание библиотеки DePro".