【Problem Description】
TextEdit is a text editor drawn using GameCanvas. This paper combines examples to provide implementation methods.
【principle】
1 Use Graphics and GameCanvas to draw text boxes and cursors.
2 When an input event is detected, jump to the advanced interface ->TextBox. Complete input through the system call input method.
3 Return the value entered by TextBox to the TextEdit object.
【Design Pattern】
This process is a bit similar to the decorative mode. In fact, the input is still TextBox, which is just decorated with TextBox to create a beautiful appearance.
【Code List】
TextEdit.javapackage com.token.view.components; import javax.microedition.lcdui.Font; import javax.microedition.lcdui.Graphics; import java x.microedition.lcdui.game.GameCanvas; public class TextEdit extends GameCanvas { private Font ft; public int width; public int height; public TextEdit(GameCanvas canvas) { super(false); } //Draw the text box public void drawTextBox(GameCanvas canva s, Graphics graphics, String text, int x, int y, boolean cursorBlinkOn) { / /System.out.println("draw"); int padding = 4; int margin = 2; ft = Font.getFont(Font.FACE_PROPORTIONAL,Font.STYLE_PLAIN,Font.SIZE_MEDIUM); graph ics.setFont(ft); width = 3*canvas.getWidth()/5+2*padding; height = ft.getHeight()+2*padding; graphics.setColor(Color.frame); graphics.fillRect(x+1,y +1,width+margin ,height+margin); graphics.setColor(Color.frameBg); graphics.drawRect(x, y,width, height); graphics.setColor(Color.background); gra phics.fillRect(x+1, y+1,width -1,height-1); graphics.setColor(Color.text); graphics.drawString(text, x+padding, y+padding, Graphics.TOP|Graphics.LEFT); drawCursor (graphics, x+ft.stringWidth( text)+padding, y+padding, 1, ft.getHeight(), cursorBlinkOn); canvas.flushGraphics(x,y,width,height); } //Draw the cursor public void drawCursor (Graphics graphics, int x, int y , int width, int height, boolean cursorBlinkOn) { if(cursorBlinkOn) { ft = Font.getFont(Font.FACE_PROPORTIONAL,Font.STYLE_PLAIN,Font.SIZE_MEDIUM); grab hics.setFont(ft); graphics.setColor(0x0,0x0, 0x0); graphics.drawLine(x+width,y,x+width,y+height); } } } PopUpTextBox.javapackage com.token.view; import javax.microediti on.lcdui.Command; import javax.microedition.lcdui. CommandListener; import javax.microedition.lcdui.Displayable; import javax.microedition.lcdui.TextBox; import com.token.util.UIController; pub lic class PopUpTextBox extends TextBox { private UIController controller; protected String canvasText = ""; private Command okCommand; private Command cancelCommand; private String object_name = null; private String editor = null; private Object args_t[]; private Object[] args; public PopUpTextBox(UIController control, String title, String text, int maxsize, int constraints) { super(title , text, maxsize, constraints); controller = control; args = new Object[6]; okCommand = new Command("OK", Command.OK, 1); cancelCommand = new Command("Cancel", Command.CANCEL, 1 ); this.addCommand(okCommand); this.addCommand(cancelCommand); this.setCommandListener(new TextBoxListener()); } public void init(Object[] args) { object_name = ((String)args[0]!=null )?(String)args[0]:""; editor = ((String)args[1]!=null)?(String)args[1]:""; //System.out.println(object_name); //System.out.println(editor); args_t = args; this.setString(""); } protected void closeTextBox(boolean update) { if (update) canvasText = th s.getString(); //System.out. println(canvasText); if(object_name.equals("registScreen")) { if(editor.equals("regist_name")) { if(args_t[3]!=""||args_t[3]!=null|| : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : args_t[4]!=""||args_t[4]!=null) { args[0] = object_name; args[1] = editor; args[2] = this.canvasText; args[3] = args_t[3 ]; args[4] = args_t[4]; } controller.handleEvent(UIController.EventID.EVENT_USER_REGIST_EDIT_BACK,args); } else if(editor.equals("regist_pa sswd")) { if(args_t[2]!="" ||args_t[2]!=null||args_t[4]!=""||args_t[4]!=null) { args[0] = object_name; args[1] = editor; args[2] = args_t [2]; args[3] = this.canvasText; args[4] = args_t[4]; } controller.handleEvent(UIController.EventID.EVENT_USER_REGIST_EDIT_BACK,args); } els e if(editor.equals("regist_passwd_re")) { if(args_t[2]!=""||args_t[2]!=null||args_t[3]!=""||args_t[3]!=null) { args[0] = object_name; args[ 1] = editor; args[2] = args_t[2]; args[3] = args_t[3]; args[4] = this.canvasText; } controller.handleEvent(UIController.EventID.EVENT_USER_RE GIST_EDIT_BACK,args); } } //... } private class TextBoxListener implements CommandListener { public void commandAction(Command command, Displayable disp) { if(command==okCommand) { closeT extBox(true); } else if(command==cancelCommand) { closeTextBox(false) ; } } } } UserRegist.javapackage com.token.view; import javax.microedition.lcdui.Font; import javax.microedition.lcdui.Graphics; import ja vax.microedition.lcdui.game.GameCanvas; import com.token.model. *; import com.token.util.*; import com.token.view.components.*; public class UserRegist extends GameCanvas implements Runnable { private UIController controller; private Graphics graphics; private Font ft; private Menu menu; private Head head; private BackGroud backGroud; private UserDataRecord userRecord; private String title; private TextEdit textEdit_name; private TextEdit textEdit_pa sswd; private TextEdit textEdit_passwd_re; private int textEdit_name_x; private int textEdit_name_y; private int textEdit_passwd_x; private e int textEdit_passwd_y; private int textEdit_passwd_re_x; private int textEdit_passwd_re_y; private int currentlySelectedIndex = 0; private String username; private String passwd; private String passwd_re; long caretBlinkDelay = 500L; long lastCaretBlink = 0 ; private String object_name; private String editor; private boolean cursorBlinkOn1; private boolean cursorBlinkOn2; private boolean cursorBlinkOn3; private in t width; private int height; public UserRegist(UIController control) { super(false); this.controller=control; this.title = "User Registration"; setFullScreenMode(tr ue); graphics = getGraphics(); width = getWidth(); height = getHeight(); menu = new Menu(this); head = new Head(this); backGroud = new BackGroud(this); userRecord = new UserDataRecord(); textEdit_nam e = new TextEdit(this); textEdit_passwd = new TextEdit(this) ; textEdit_passwd_re = new TextEdit(this); } public void show(Object[] args) { // TODO Auto-generated method stub setFullScreenMode(true); ob subject_name = ((String)args[0]!=null)?(String )args[0]:""; editor = ((String)args[1]!=null)?(String)args[1]:""; username = ((String)args[2]!=null)? (String)args[2]:""; passwd = ((String)args[3]!=null)?(String)args[3]:""; passwd_re = ((String)args[4]!=null )?(String)args[4]:""; if(editor.equals("regist_name")) { cursorBlinkOn1 = true; cursorBlinkOn2 = false; cursorBlinkOn3 = false; currentlySelec tedIndex =0; } else if(editor.equals(" register_passwd")) { cursorBlinkOn1 = false; cursorBlinkOn2 = true; cursorBlinkOn3 = false; currentlySelectedIndex =1; } else if(editor.equals(" regist_passwd_re")) { cursorBlinkOn1 = false; cursorBlinkOn2 = false; cursorBlinkOn3 = true; currentlySelectedIndex =2 ; } //System.out.println(object_name); //System.out.println(editor); draw(); redraw(); } public void draw() { //clearScreen(); backGroud .drawBackGroud(this , graphics); head.drawHead(this,graphics,this.title); menu.drawMenu(this,graphics,"Next","Exit"); drawBody(); } private void redraw() { switch(currentlySelectedIndex) { case 0: { cursorBlinkOn2 = false; cursorBlinkOn3 = false; editor = "regist_name"; break; } case 1: { cursorBlinkOn1 = false; cursorBlinkOn3 = false e; editor = "regist_passwd"; break; } case 2: { cursorBlinkOn1 = false ; cursorBlinkOn2 = false; editor = "regist_passwd_re"; break; } default:; } textEdit_name.drawTextBox(this, graphics, username, textEdit_ name_x, textEdit_name_y, cursorBlinkOn1); textEdit_passwd.drawTextBox(this, graphics, passwd, textEdit_passwd_x, textEdit_passwd_y, cu rsorBlinkOn2 ); textEdit_passwd.drawTextBox(this, graphics, passwd_re, textEdit_passwd_re_x, textEdit_passwd_re_y, cursorBlinkOn3); textEdit_name.fl ushGraphics(); } public void drawBody() { int margin =5; ft = Font.getFont(Font.FACE_PROPORTIONAL,Font.STYLE_BOLD ,Font.SIZE_LARGE); String info = "Username: /n"; String info_wrap1[] = StringDealMethod.format(info, width-10, ft); graphics.setFont(ft); graphics .setColor(Color.text) ; for(int i=0; i<info_wrap1.length; i++) { graphics.drawString(info_wrap1[i],5, (i) * ft.getHeight()+40, Graphics.TOP|Graphics.LEFT ); } textEdit_name_x = 5; textEdit_name_y = info_wrap1.length * ft.getHeight()+40; textEdit_name.drawTextBox(this, graphics, username, textEdit_name_x, textEdit_name_y, cursorBlinkOn1); info = "User Password: /n"; String info_wrap2[] = StringDealMethod.format(info, width-10, ft); graphics.setFont(ft); graphics.setColor(Color.text); for(int i=0; i<info_wrap2.length; i+ +) { graphics.drawString(info_wrap2 [i],5, (i+info_wrap1.length) * ft.getHeight()+textEdit_name.height+margin+40, Graphics.TOP|Graphics.LEFT); } textEdit_passwd_x = 5; textEdit_passwd_y = (info_wrap1.length+info_wrap2 .length) * ft.getHeight()+textEdit_name.height+margin+40; textEdit_passwd.drawTextBox(this, graphics, passwd, textEdit_passwd_x, textEdit_passwd_y, cursorBlinkOn2); info = "Password confirmation: /n"; String info_wrap3[] = StringDealMethod.format(info, width-10, ft); graphics.setFont(ft); graphics.setColor(Color.text); for(int i=0; i<info_wrap3.length; i+ +) { graphics.drawString(info_wrap3 [i],5, (i+info_wrap1.length+info_wrap2.length) * ft.getHeight()+textEdit_name.height+textEdit_passwd.height+2*margin+40, Gra phics.TOP|Graphics.LEFT); } textEdit_passwd_re_x = 5; textEdit_passwd_re_y = (info_wrap1.length+info_wrap2.length+info_wrap3.length) * ft.getHeight()+textEdit_name.height+textEd it_passwd.height+2*margin+40; textEdit_passwd_re.drawTextBox(this, graphics, passwd_re, textEdit_passwd_re_x, textEdit_passwd_re_y, cursorBlinkOn3); } public void clearScreen() { graphics.setColor(0xff,0xff,0xff); graphics.fillRect(0, 0, width, height ); } public void checkTimeStamp() { long currentTime = System.currentTimeMillis( ); //System.out.println("1"); if(lastCaretBlink + caretBlinkDelay < currentTime) { //System.out.println("2"); if(editor.equals("regist_name") ) { cursorBlinkOn1 =! cursorBlinkOn1; cursorBlinkOn2 = false; cursorBlinkOn3 = false; } else if(editor.equals("regist_passwd")) { cursorBlinkOn1 = false; cursorBlin kOn2 =! cursorBlinkOn2; cursorBlinkOn3 = false; } else if(editor.equals("regist_passwd_re" )) { cursorBlinkOn1 = false; cursorBlinkOn2 = false; cursorBlinkOn3 =! cursorBlinkOn3; } lastCaretBlink = currentTime; } } public void run() { //Syst em.out.println("run"); while(true) { checkTimeStamp() ; redraw(); try { synchronized(this) { //System.out.println("3"); wait(50L); } } catch(Exception e) { e.printStackTrace(); } } } } protec ted void keyPressed (int keyCode) { switch(keyCode) { case KeyID.SOFT_RIGHT: { controller.handleEvent(UIController.EventID.EVENT_EXIT,null); break; } case KeyID.SOFT_LEFT: { if(username!="" && passwd!=" "&&passwd_re!="") { if(passwd.equals(passwd_re)) { userRecord.db_deleteAllRecord(); if(userRecord.db_getRecord(1)==null) { UserDataItem userItem = new UserDataItem(1,(username+"," +passwd).getBytes()); userRecord.db_addRecord(userItem); userItem = null; System.gc(); } String update = "start"; Object [] args = {"ac tiveScreen", null, update}; controller .handleEvent(UIController.EventID.EVENT_NEXT_ACTIVE_TOKEN_SCREEN,args); } } break; } case KeyID.KEY_EDIT: case KEY_NUM0: case KEY_NUM1: c ase KEY_NUM2: case KEY_NUM3: case KEY_NUM4: case KEY_NUM5: case KEY_NUM6: case KEY_NUM7: case KEY_NUM8: case KEY_NUM9: { //System.out.println(editor); Object[] args = {object_name,editor,username,passwd,passwd_re}; controller.handleEvent(UICon troller.EventID.EVENT_USER_REGIST_EDIT,args); break; } default:; } keyCode = getGameAction(keyCode); switch(keyCode) { case UP: case LEFT: { currentlySelectedIndex--; if(currentlySelectedIndex<0) { c urrentlySelectedIndex=0; } else { redraw(); } break; } case DOWN: case RIGHT: { currentlySelectedIndex++; if(currentlySelectedIndex>2) { currentlySelectedIndex=2; } else { redraw(); } break; } } } }【analyze】
1 Drawing of text boxes (TextEdit.java)
You need to pass GameCanvas and Graphics objects to implement drawing, who uses the strategy and who passes this parameter. In addition, the upper left corner coordinate (x, y) of the text box under the bed and the variable cursorBlinkOn that controls the cursor flashing.
public void drawTextBox(GameCanvas canvas, Graphics graphics, String text, int x, int y, boolean cursorBlinkOn) { //System.out.println("draw"); in t padding = 4; int margin = 2; ft = Font. getFont(Font.FACE_PROPORTIONAL,Font.STYLE_PLAIN,Font.SIZE_MEDIUM); graphics.setFont(ft); width = 3*canvas.getWidth()/5+2*padding; heig ht = ft.getHeight()+2*padding; graphics.setColor(Color.frame); graphics.fillRect(x+1,y+1,width+margin,height+margin); graphics.setColor(Color.frameBg); graphi cs.drawRect(x, y,width, height ); graphics.setColor(Color.background); graphics.fillRect(x+1, y+1,width-1,height-1); graphics.setColor(Color.text); graphics.dr awString(text, x+padding , y+padding, Graphics.TOP|Graphics.LEFT); drawCursor(graphics, x+ft.stringWidth(text)+padding, y+padding, 1, ft.getHeight(), cursorB linkOn); canvas.flushGraphics(x, y,width,height); }2 Draw the cursor (TextEdit.java)
public void drawCursor(Graphics graphics, int x, int y, int width, int height, boolean cursorBlinkOn) { if(cursorBlinkOn) { ft = Font.getFont(Font.FAC E_PROPORTIONAL,Font.STYLE_PLAIN,Font.SIZE_MEDIUM); graphics.setFont (ft); graphics.setColor(0x0,0x0,0x0); graphics.drawLine(x+width,y,x+width,y+height); } }3 Implement cursor flashing
The implementation of cursor flashing requires threading. In the UIController.java class, the view class of the text box needs to be drawn and the thread interface needs to be implemented.
UIController.javacase EventID.EVENT_NEXT_USER_REGIST_SCREEN: case EventID.EVENT_USER_REGIST_EDIT_BACK: { reg.show(args); Thread thread = new Thread (reg); thread.start(); midlet.setCurrent(reg); break; } UserRegist.javapublic void checkTimeStamp () { long currentTime = System.currentTimeMillis(); //System.out.println("1"); if(lastCaretBlink + caretBlinkDelay < currentTime) { //System.out. println("2"); if(editor .equals("regist_name")) { cursorBlinkOn1 =! cursorBlinkOn1; cursorBlinkOn2 = false; cursorBlinkOn3 = false; } else if(editor.equals("regist_pass wd")) { cursorBlinkOn1 = false; cursorBlinkOn2 =! cursorBlinkOn2; cursorBlinkOn3 = false; } else if(editor.equals("regist_passwd_re")) { cursorBlinkOn1 = false; cursorBlinkOn2 = false; cursorBlinkOn3 =! cursorBlinkOn3; } lastCaretBlink = cu rrentTime; } } public void run() { //System.out.println("run" ); while(true) { checkTimeStamp(); redraw(); try { synchronized(this) { //System.out.println("3"); wait(50L); } } catch(Exception e) { e . printStackTrace(); } } }
4 Call the Advanced Interface TextBox Subclass PopUpTextBox
When calling, the call object name, edit object name, and edit box parameters are passed to the PopUpTextBox object (must have it, the purpose is to save the value of the edit box. Otherwise, when multiple calls return, the values of different edit boxes will be refreshed to empty. )
UserRegist.java(KeyPressed)case KeyID.KEY_EDIT: case KEY_NUM0: case KEY_NUM1: case KEY_NUM2: case KEY_NUM3: case KEY_NUM4: case KEY_ NUM5: case KEY_NUM6: case KEY_NUM7: case KEY_NUM8: case KEY_NUM9: { //System.out.println( editor); Object[] args = {object_name,editor,username,passwd,passwd_re}; controller.handleEvent(UIController.EventID.EVENT_USER_REGIST_EDI T,args); break; } UIController.javacase EventID.EVENT_USER_REGIST_EDIT: { textBox.init(args) ; midlet.setCurrent(textBox); break; }
5 PopUpTextBox parameter reception
public void init(Object[] args) { object_name = ((String)args[0]!=null)?(String)args[0]:""; editor = ((String)args[1]!=null) ?(String)args[1]:""; //System.out.println(object_name); //System.out.println(editor); args_t = args; this.setString(""); }6 PopUpTextBox returns the value input from the input method
if (update) canvasText = this.getString();
7 PopUpTextBox input value processing
Process the input value according to the called object and the edit object, and pass it to the parent object edit box.
if(object_name.equals("registScreen")) { if(editor.equals("regist_name")) { if(args_t[3]!=""||args_t[3]!=null||args_t[4]! =""||args_t[4]!=null) { args[0] = object_name; args[1] = editor; args[2] = this.canvasText; args[3] = args_t[3]; args[4 ] = args_t[4]; } controller.handleEvent(UIController.EventID.EVENT_USER_REGIST_EDIT_BACK,args); } else if(editor.equals("regist_passwd")) { if(args_t[2]!=""||args_t[2 ]!=null||args_t[4]!=""||args_t[4]!=null) { args[0] = object_name; args[1] = editor; args[2] = args_t[2]; args [3] = this.canvasText; args[4] = args_t[4]; } controller.handleEvent(UIController.EventID.EVENT_USER_REGIST_EDIT_BACK,args); } else if(editor .equals("regist_passwd_re")) { if(args_t[ 2]!=""||args_t[2]!=null||args_t[3]!=""||args_t[3]!=null) { args[0] = object_name; args[1] = editor; args[2] = args_t[2]; args[3] = args_t[3]; args[4] = this.canvasText; } controller.handleEvent(UIController.EventID.EVENT_USER_REGIST_EDIT_BA CK,args); } }
8 Display of input values
(1) Create a new object
private TextEdit textEdit_name; textEdit_name = new TextEdit(this);
(2) Accept input parameters
object_name = ((String)args[0]!=null)?(String)args[0]:""; editor = ((String)args[1]!=null)?(String)args[1]:" "; username = ((String)args[2]!=null)?(String)args[2]:""; passwd = ((String)args[3]!=null)?(String)args[3] :""; passwd_re = ((String)args[4]!=null)?(String)args[4]:"";
(3) Cursor control, positioning to the editing object, and controlling the cursor flashing of the editing object (run method)
private void redraw() { switch(currentlySelectedIndex) { case 0: { cursorBlinkOn2 = false; cursorBlinkOn3 = false; editor = "regist_name"; break; } case 1: { cursorBlinkOn1 = false; cursorBlinkOn3 = false; editor = "regist_passwd"; break; } case 2: { cursorBlinkOn1 = false; cursorBlinkOn2 = false; editor = "regist_passwd_re"; break; } default:; } //... }
(4) Drawing of edit box
private void redraw() { ... textEdit_name.drawTextBox(this, graphics, username, textEdit_name_x, textEdit_name_y, cursorBlinkOn1); textEdit _passwd.drawTextBox(this, graphics, passwd, textEdit_passwd_x, textEdit_passwd_y, cursorBlinkOn2); textEdit_passwd.drawTextBox(this, graphics , passwd_re, textEdit_passwd_re_x, textEdit_passwd_re_y, cursorBlinkOn3); textEdit_name.flushGraphics(); }The effect achieved is shown in Figure 1: