Step 1 of the swing Interface Design Tool

Source: Internet
Author: User
Http://blog.sina.com.cn/s/blog_4b6047bc01000bex.html
A common method for solving complex problems is the analytical synthesis method, or divide and conquer, which breaks down complicated problems into simple subproblems. After solving each sub-problem, integrate them. If each sub-problem is still too complex, repeat the process until it is easy to solve. If the problem itself is complex, but it is not easy to continue, you can try to simplify the problem model. After the prototype is developed, other features will be added one after another, gradually enrich the original scale until approaching the problem. Swing interface design tools are complex software systems. Before development, we should simplify the analysis. Based on previous experience, the functional modules of such tools are divided into three parts: 1. the interface design component visually displays the currently designed interface in WYSIWYG mode. The functions include selecting and editing components, the selection can be divided into single choice, multiple choice, region selection, component drag-and-drop, size adjustment, etc, component editing includes adding, deleting, copying, cutting, pasting, alignment, and layout management. In addition to these functions, the interface design component should provide event and action interfaces to other parts of the system, such as the property editing page, component selection panel, and component selection toolbar. 2. interface Design auxiliary tools, such as attribute, event, Layout View and edit tool property pages, design the browsing, navigation, and selection of the component tree, component selection toolbar, and the toolbar corresponding to the editing operation of the interface design tool. 3. Metadata and code parsing and generation tools. This part is invisible, but it is the difficulty and core of the interface design tool. It is often an important criterion for evaluating the advantages and disadvantages of an interface design tool. I plan to develop this system in iterative mode, first develop the sub-modules in sequence, and then combine them. Each stage involves three elements: design, encoding, and reconstruction. The program continues to evolve. First, consider the development of interface design components. As described above, its functions can be divided into component selection and editing. The component selection module shares a set of status data during running, such as the selected component, the drag-and-drop component, the current mouse position, and the border of the selected rectangle. The concepts and technologies of implementation have been mentioned earlier. First, we need to implement its visual design interface components. First, assume that the currently designed interface component tree has been built in the memory, and its root is a component. During rendering, you only need to paint the interface design method, you can call the rendering method paint of the root component to render it. The method is roughly as follows (in its UI class ):

Public void paint (Graphics g, jcomponent c ){
If (Component! = NULL ){

// If the currently designed component is not empty, this component is drawn.
Paintdesignedcomponent (g );
}

If (selected_components! = NULL )&&! Selected_components.isempty ()){

// If the selected component is not empty, draw their resizing border.
Paintresizing (g );
}

If (selection_bounds! = NULL ){

// If you are currently selecting a component, draw a selection box
G. setcolor (selection_color );
G. drawrect (selection_bounds.x + left_pad, selection_bounds.y + top_pad, selection_bounds.width,
Selection_bounds.height );
}
}

Private void paintresizing (Graphics g, jcomponent c ){

// Whether the selected components can be resize

// Components in container components with layout manager cannot be resizeable

// In addition, if the selected components span several containers, they should not be able to resizeable
Boolean resizable = isselectedresizable ();

For (Component COMP: selected_components ){

Rectangle bounds = getrelativebounds (COMP );

G. setcolor (selection_color );

Int x = bounds. x + left_pad;
Int y = bounds. Y + top_pad;
Int W = bounds. width;
Int H = bounds. height;

// Draw the highlighted border of the selected component

G. drawrect (X, Y, W, H );

If (resizable ){

// For resizable, draw the drag-and-drop vertex rectangle.

Drawresizingthumbs (G, X, Y, W, H );
}
}
}

Private void paintdesignedcomponent (Graphics g, jcomponent c ){

// This is the same as previously mentioned. When using Renderer technology, make sure that the rendering component is not buffered.
Arraylist dbcomponents = new arraylist ();

Disablebuffer (component, dbcomponents );

Int width = component. getwidth ();
Int Height = component. getheight ();

// Create a cut window graphical object relative to the root component
Graphics clipg = G. Create (left_pad, top_pad, width, height );

// Use and component Rendering

Component. Paint (clipg );
Clipg. Dispose ();

Int x = left_pad-border_thick;
Int y = top_pad-border_thick;
Int W = width + 2 * border_thick;
Int H = height + 2 * border_thick;

// Draw the outer border

Areaborder. paintborder (component, G, X, Y, W, H );
Resetbuffer (dbcomponents );
}

There is not much time. Let's write it here today. Tomorrow, I will explain in detail how to add selection, keyboard, editing, and other functions to the interface design tool. Here are some preliminary code downloads. You can select, drag, drop, add, delete, copy, and paste components. Below is:

Update:

In the past two days, we have further restructured and added some new functions and annotations. The current design interface tool can be used for layout management, adding, adding, deleting, copying, cutting, pasting, and alignment functions, and modifying the tool bar for selecting components, you can add a container class. Below are several:

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.