TouchGFX设计模式代码实例说明

一)Model - View - Presenter (MVP) 模式在 TouchGFX 中的应用
1)Model(模型):

模型代表应用程序的数据和业务逻辑。例如,在一个简单的计数器应用中,模型可以是一个包含计数器当前值的类。

cpp 复制代码
class CounterModel 
{
private:
    int count;
public:
    CounterModel() : count(0) {}
    int getCount() const 
    {
        return count;
    }
    void increment() 
    {
        count++;
    }
};

2)View(视图):

在 TouchGFX 中,视图是通过界面设计工具创建的图形用户界面(GUI)元素。例如,有一个文本框用于显示计数器的值,一个按钮用于增加计数器的值。这些 GUI 元素在 TouchGFX Designer 中设计,然后在代码中通过相关的类来引用。

视图类需要能够更新界面显示,以反映模型的状态变化。以下是一个简单的视图类示例,用于显示计数器的值:

cpp 复制代码
class CounterView : public touchgfx::View
 {
private:
    touchgfx::TextAreaWithOneWildcard& countText;
public:
    CounterView(touchgfx::TextAreaWithOneWildcard& textArea) : countText(textArea) {}
    void updateCounterDisplay(int count)
     {
        Unicode::snprintf(countText.getBuffer(), countText.getBufferSize(), "%d", count);
        countText.invalidate();
    }
};

3)Presenter(展示器):

展示器作为模型和视图之间的桥梁,它包含对模型和视图的引用,并处理用户交互。当用户点击增加计数器的按钮时,展示器会调用模型的increment方法来更新数据,然后调用视图的updateCounterDisplay方法来更新界面。

cpp 复制代码
class CounterPresenter 
{
private:
    CounterModel& model;
    CounterView& view;
public:
    CounterPresenter(CounterModel& m, CounterView& v) : model(m), view(v) {}
    void handleIncrementButtonClicked() 
    {
        model.increment();
        view.updateCounterDisplay(model.getCount());
    }
};

使用示例:

在main函数或者应用程序初始化的地方,可以这样使用 MVP 模式构建计数器应用。

// 创建模型、视图和展示器

cpp 复制代码
CounterModel counterModel;
touchgfx::TextAreaWithOneWildcard countTextArea;
CounterView counterView(countTextArea);
CounterPresenter counterPresenter(counterModel, counterView);

// 假设这里有一个按钮点击事件处理器,将其与展示器的方法关联

Button incrementButton;

incrementButton.setClickAction(counterPresenter, &CounterPresenter::handleIncrementButtonClicked);
二)Model - View - Controller (MVC) 模式在 TouchGFX 中的应用示例(与 MVP 类似但有区别)

1)Model(模型):

同样以计数器应用为例,模型类和 MVP 模式中的类似。

cpp 复制代码
class CounterModel
 {
private:
    int count;
public:
    CounterModel() : count(0) {}
    int getCount() const
     {
        return count;
    }
    void increment() {
        count++;
    }
};

2)View(视图):

在 MVC 模式中,视图主要负责显示。它会从模型获取数据来更新自己的显示,但不像 MVP 中的视图那样直接被展示器调用更新方法。

cpp 复制代码
class CounterView : public touchgfx::View 
{
private:
    touchgfx::TextAreaWithOneWildcard& countText;
public:
    CounterView(touchgfx::TextAreaWithOneWildcard& textArea) : countText(textArea) {}
    void updateCounterDisplay(int count)
     {
        Unicode::snprintf(countText.getBuffer(), countText.getBufferSize(), "%d", count);
        countText.invalidate();
    }
};

3)Controller(控制器):

控制器处理用户输入和模型更新,同时也会通知视图更新显示。与 MVP 不同的是,它的职责划分更侧重于控制整个流程。

cpp 复制代码
class CounterController
 {
private:
    CounterModel& model;
    CounterView& view;
public:
    CounterController(CounterModel& m, CounterView& v) : model(m), view(v) {}
    void handleIncrementButtonClicked() 
    {
        model.increment();
        view.updateCounterDisplay(model.getCount());
    }
};

使用示例:

与 MVP 模式类似,在应用程序初始化阶段使用 MVC 模式构建计数器应用。

// 创建模型、视图和控制器

CounterModel counterModel;

touchgfx::TextAreaWithOneWildcard countTextArea;

CounterView counterView(countTextArea);

CounterController counterController(counterModel, counterView);

// 假设这里有一个按钮点击事件处理器,将其与控制器的方法关联

Button incrementButton;

incrementButton.setClickAction(counterController, &CounterController::handleIncrementButtonClicked);

这些设计模式有助于将 TouchGFX 应用程序的不同职责分离,使得代码更加模块化、易于维护和扩展。在实际应用中,可以根据具体的项目需求选择合适的设计模式。

相关推荐
水宝的滚动歌词5 小时前
设计模式之适配器模式
设计模式·适配器模式
冷雨夜中漫步8 小时前
领域驱动设计(4)—绑定模型与实现
java·开发语言·笔记·后端·设计模式
JINGWHALE111 小时前
设计模式 结构型 外观模式(Facade Pattern)与 常见技术框架应用 解析
前端·人工智能·后端·设计模式·性能优化·系统架构·外观模式
JINGWHALE114 小时前
设计模式 结构型 代理模式(Proxy Pattern)与 常见技术框架应用 解析
前端·人工智能·后端·设计模式·性能优化·系统架构·代理模式
泰山小张只吃荷园15 小时前
软件体系结构、设计模式、课程期末复习知识点全总结-SCAU
网络·数据库·sql·计算机网络·设计模式·sqlserver
angen201815 小时前
二十三种设计模式-抽象工厂模式
设计模式·抽象工厂模式
玉面小君21 小时前
C#设计模式(行为型模式):备忘录模式,时光倒流的魔法
设计模式·c#·备忘录模式
咖啡の猫1 天前
单例设计模式
java·开发语言·单例模式·设计模式
不是二师兄的八戒1 天前
Java 高级设计模式:深度解读与应用实例
java·单例模式·设计模式
谢栋_1 天前
设计模式从入门到精通之(三)单例模式
java·单例模式·设计模式