- float random_number[] = { 15.72058f, 13.5207f, 11.89068f, 11.52808f, 12.79996f, 15.64194f, 19.5641f, 23.76272f, 27.31082f, 29.38111f, 29.44686f, 27.41166f, 23.63623f, 18.85561f, 14.0067f, 10.00822f, 7.54646f, 6.91894f, 7.9737f, 10.15872f, 12.66879f, 14.65338f, 15.43436f, 14.67961f, 12.49004f, 9.37813f, 6.14351f, 3.67557f, 2.7319f, 3.74666f, 6.71617f, 11.19009f, 16.37062f, 21.29599f, 25.06366f, 27.03928f, 27.00043f, 25.18074f, 22.20367f, 18.92286f, 16.20808f, 14.72967f, 14.79419f, 16.27155f, 18.63144f, 21.07988f, 22.76223f, 22.98262f, 21.38562f, 18.05532f, 13.50694f, 8.57267f, 4.20914f, 1.27323f, 0.32068f, 1.47657f, 4.40899f, 8.41221f, 12.57907f, 16.02009f, 18.07607f, 18.47218f, 17.37615f, 15.34661f, 13.18478f, 11.72615f, 11.62375f, 13.17641f, 16.24474f, 20.27564f, 24.42979f, 27.78132f, 29.54078f, 29.24728f, 26.88245f, 22.87856f, 18.01858f, 13.25226f, 9.47326f, 7.31119f, 6.98926f, 8.28185f, 10.58186f, 13.06097f, 14.88297f, 15.41768f, 14.40254f, 12.01216f, 8.81852f, 5.65146f, 3.39358f, 2.75987f, 4.11623f, 7.38144f, 12.03707f, 17.2432f, 22.03209f, 25.5329f, 27.17287f, 26.80623f };
- void homeView::handleTickEvent()
- {
- static uint8_t i = 0;
- dynamicGraph1.addDataPoint(random_number[i]);
- i++;
- if (i >= 100) i = 0;
- if (i % 20 == 0)
- {
- Unicode::snprintfFloat(power_textBuffer, POWER_TEXT_SIZE, "%.1f", random_number[i]);
- power_text.invalidate();
- }
- }
1.11 最终效果
2.动态更新列表
设备运行时会产生许多条消息，这些消息我希望能实现类似智能手机的消息条机制，可以随意清除其中的某一条，然后后面的自动递补上
2.1 创建一个单个消息条的自定义控件，并给其中的按键设置一个点击事件，调用自定义函数 deleteAction
2.2 添加一个可滚动容器（让里面的元素可以滚动），一个列表布局（实现自动排列功能），并调整大小
2.3 将list拖到scrollCnt的下面
2.4 配置list 方向设置为上下布局
2.5 设置自定义组件函数 setupListElement设置里面显示的文字 setAction设置回调函数 deleteAction调用上一层的回调函数
- void CustomListElement::setupListElement(TEXTS iconTextID)
- {
- text.setTypedText(TypedText(iconTextID));
- text.resizeToCurrentText();
- invalidate();
- }
- void CustomListElement::setAction(GenericCallback< CustomListElement& >& callback)
- {
- viewCallback = &callback;
- }
- void CustomListElement::deleteAction()
- {
- // Inform the view of the event
- if (viewCallback->isValid())
- {
- viewCallback->execute(*this);
- }
- }
2.6 设置初始化，添加自定义控件元素到list下
- void alertView::setupScreen()
- {
- alertViewBase::setupScreen();
- list.setHeight(0); //Compensates for the list height that is set to 200 by the designer
- listElements[0].setupListElement(T_LIST_ELEMENT_00);
- listElements[1].setupListElement(T_LIST_ELEMENT_01);
- listElements[2].setupListElement(T_LIST_ELEMENT_02);
- listElements[3].setupListElement(T_LIST_ELEMENT_03);
- listElements[4].setupListElement(T_LIST_ELEMENT_04);
- listElements[5].setupListElement(T_LIST_ELEMENT_05);
- listElements[6].setupListElement(T_LIST_ELEMENT_06);
- listElements[7].setupListElement(T_LIST_ELEMENT_07);
- listElements[8].setupListElement(T_LIST_ELEMENT_08);
- listElements[9].setupListElement(T_LIST_ELEMENT_09);
- listElements[10].setupListElement(T_LIST_ELEMENT_10);
- for (uint8_t i = 0; i < numberOfListElements; ++i)
- {
- listElements[i].setAction(listElementClickedCallback);
- list.add(listElements[i]);
- }
- scrollCnt.setX(480);
- }
2.7 回调函数，删除list里面的一个子元素
- void alertView::listElementClicked(CustomListElement& element)
- {
- // The button of the list element has been pressed
- // so it is removed from the list
- list.remove(element);
- scrollCnt.invalidate();
- }
2.8最终效果
3.动画
TouchGFX提供了一套简单的做动画的机制，很简单就能实现动画效果
3.1 选中需要做动画组件控件，勾选MoveAnimator
3.2 设置屏幕转换结束回调
3.3 设置控件初始位置（函数被简化）
- void alertView::setupScreen()
- {
- alertViewBase::setupScreen();
- scrollCnt.setX(480);
- }
3.4 屏幕转换结束回调，设置动作动画
- void alertView::ScreenBegins_function()
- {
- scrollCnt.setMoveAnimationDelay(0);
- scrollCnt.startMoveAnimation(80, scrollCnt.getY(), 15, EasingEquations::cubicEaseInOut);
- }
3.5 最终效果
三、实际效果演示
楼主
