mg游戏技巧最高机密

書(shū)名： Dart：Scalable Application Development
作者名： Davy Mitchell Sergey Akopkokhyants Ivo Balbaert
本章字?jǐn)?shù)： 506字
更新時(shí)間： 2021-07-09 18:56:16

The next steps for the text editor

We have had some feedback on the text editor so far. Users like it and want more buttons, and the top priority is a word-count feature that displays a dialog with the current count. Customers have has indicated that they would like a powerful toolbar above the editor pane for a range of features. They like the pop-up dialog style, but say that the current one does not fit into the look of the application.

Starting point

Open the code sample for Chapter 2, Advancing the Editor texteditor to see a slightly modified version of the project from the first chapter. It is not ready to run out of the box as we will add in a package to deal with the dialog creation.

The text editor functionality has been moved into a separate file—our main.dart was getting rather cluttered. My personal preference is to keep it as minimal as possible. The main.dart now imports a file, editor.dart, and the main function is used to connect the interface to the Editor object, which now contains our functions as methods of the TextEditor class.

Note

Dart is an object-orientated language like C# and Java. In object-orientated languages, objects can be defined as class declarations that typically group together variables and functions to model an aspect of a system. For more information on object-orientated programming, see https://en.wikipedia.org/wiki/Object-oriented_programming.

For example, web browsers have the document and window classes that can be accessed from JavaScript. These objects encapsulate aspects of the web page structure and web browser window in functions and properties.

Even if you have not written classes with JavaScript, you will likely have called functions and accessed properties on the built-in browser page objects such as the document.getElementById() method and the document.body property.

Dart classes

We have already encountered classes for HTML elements and event handlers. Dart has an advanced single-inheritance class system. Classes are declared with the class keyword. The editor.dart file has a class for the TextEditor (an abbreviated version is shown below):

class TextEditor {
    final TextAreaElement theEditor;
    ...
    TextEditor(this.theEditor){
    ...
    }
    ...
}

The constructor is declared as the same name of the class, and we have a single parameter. Dart constructors have a convenient feature for directly setting member variables from the parameter declaration. This saves having a separate parameter that is only ever used to assign to the member variable. Without using this shorthand feature, the code would be as follows:

class  TextEditor {
    final TextAreaElement theEditor;
    ...
    TextEditor(TextAreaElement theEditor){
    this.theEditor = theEditor;
    }
    ...
}

The field theEditor is declared as final; this means it can only be assigned a value once in the lifetime of the application.

Structuring the project

Our new requirements are for two pop-up dialogs, and it sounds like we may need more. We need to build an HTML interface library to cover these needs. It is general-purpose, so can be used in many types of application. The rest of the application can go in the TextEditor project.

官术网_书友最值得收藏!

Dart：Scalable Application Development

The next steps for the text editor

Starting point

Note

Dart classes

Structuring the project