如何使用构建器设计模式和抽象设计模式设计复杂的 GUI？

Question

I am trying to create a complex GUI, let's say the main panel containing a list panel and button panel. The button panel would again contain a couple of buttons. The construction sequence would be something like this:

constructMainPanel()
constructListPanel(mainpanel)
constructButtonPanel(mainPanel)
constructButton('b1',buttonPanel)
constructButton('b2',buttonPanel)

This GUI would have 2 styles: Linux and Windows. How can I design this GUI using both builder design pattern and abstract factory design pattern? How would the class diagram look like?

I understand the builder and abstract factory patterns, but how can I use them together. This is the builder pattern I refer to builder pattern wiki . This is the abstract factory pattern I refer to abstract factory wiki

Answer 1

The two patterns would cooperate as follows:

• the abstract factory would be used to create the components (panel, list panel, buttons...)
• the builder would standardize the steps for constructing the parts and assemble the whole.

It's difficult to be more specific/precise, since each of this patterns has variations. But it would probably look like (pseudocode):

factory = new LinuxGUIFactory ();  
builder = new ListChoiceBuilder (factory) // inject the factory 
builder.buildPanels()
builder.buildApproveCancelButtons(); 
form = builder.GetResult(); 

The ListChoiceBuilder would use as constructor parameter the abstract factory. It would then call the abstract methods of the abstract factory whenever it needs to create a panel, list panel, button,...

When you instantiate ListChoiceBuilder , you provide either the Linux, the Windows or the MacOs concrete factory, which uses exactly the same interface as the abstract factory. Of course, the builder is an overkill for such a simple GUI example.