Hello Vaadin Lovers! -_-
This is the structure of this threat:
[b]
1 - Goal for
Chapter 3
(link)
2 - Step by Step
3 -
QUESTIONS
[/b]
(for “Advanced Users” if they have time to explain us “why” or if they can apport some source where it explains this questions.)
1 - Goal for chapter 3
2 - Step by Step
Step 1:
We create a new Project
Step 2:
Just next
Step 3:
We give it a name
Step 4:
We search on the “Project Explorer” panel after “AddressbookApplication.java” file. And double click on it.
Step 5:
I write “// Original” comment on the Original source.
Step 6:
We go after “Source 1” on this link:
Chapter 3.1
Step 7:
We selecte this part of source on “Eclipse” and paste over “Source 1”
Step 8:
This is how it looks after. Notice that I commented “// Source 1” on it so it is more simple for you to follow me in witch part of the code I am.
Step 9:
I go to the tutorial again after “// Source 2”
Chapter 3.1
Step 10:
I paste it right over “// Source 1”
Step 11:
This is how it looks “// Source 2” on Eclipse.
Step 12:
I go to the tutorial again after this pece of code “// Source 3”.
Chapter 3.1
Step 13:
And here is where I paste it on “Eclipse” inside “// Source 1”. Inside “buildMainLayout”.
Step 14:
This is how it looks when I have paste it.
Step 15:
We move on to the next chapter.
Chapter 3.2
Step 16:
I select “// Source 4”. (Notice that I don´t take all the source! Couse there is already this pece of code inside our Eclipse.
Step 17:
And here is where I paste it on “Eclipse” right before “// Source 1” Ends.
Step 18:
This is how it looks when I have paste it.
Step 19:
Now I want to make one test if there is some “errors” on the code. So i make a “Run on server”
Step 20:
Just finish here.
Step 21:
This is how it looks our code. Great jobb!
Step 22:
I move on to the next chapter.
Chapter 3.3
Step 23:
I copy “// Source 5”
Step 24:
Inside “Eclipse” again. I click right click on “SRC” ico and PASTE.
Step 25:
This new file was created “NavigationTree.java”
Step 26:
I just comment “// Source 5” over.
Step 27:
I go to the tutorial and copy “// Source 6”
Step 28:
I paste it on Eclipse right over “Source 2”
Step 29:
This is how it looks after paste it.
Step 30:
Couse when I paste this source, it apears a simbol with a red CROSS. I click on “Source 6” And it pops up this dialog. And I chose IMPORT
Step 31:
I go to the tutorial after “Source 7” and y copy it.
Step 32:
I paste it inside "Source 4 right after “HorizontalSplic.set…etc” and before “getMainWindows…etc”
Step 33:
This is how it looks after paste it
Step 34:
I copy “Source 8”
Step 35:
Here is where I paste “Source 8”. Right after “Source 1 END”.
Step 36:
This is how it looks after paste it.
Step 37:
I go after “Source 9”
Step 38:
And I paste it on “The Project Explorer” panel, Right click over “SRC” and Paste.
Step 39:
this is how it looks. A new “LisView.java” file created, and the source inside.
Step 40:
I copy “Source 10”
Step 41:
I paste it over “Source 6”
Step 42:
This is how it looks after paste.
Step 43:
Couse it popped up again the red CROSS, I click on the source and appears the dialog. And I choose IMPORT.
Step 44:
I copy “source 11”
Step 45:
And I paste it after “Source 8”.
Step 46:
This is how it looks after paste it.
Step 47:
I go And copy “Source 12”
Step 48:
And I paste it inside “Source 1” after “buildMainLayou();”
Step 49:
This is how it looks after paste.
Step 50:
I copy “Source 13”
Step 51:
And I paste it inside “Project Explorer” / and right click over “SRC” map. And choose paste.
Step 52:
This is how it looks. after paste it. Ops! Instead to be called “Source 14” as in the image. This sould have been called “Source 13” Sorry
Step 53:
We go after “Source 15” (Source 13 and 14 it´s the same ;))
Step 54:
And I paste it on “SRC” inside “Project Explorer”
Step 55:
This is how it looks after paste.
Step 56:
I just copy the 2 first row on this source. “Source 16”
Step 57:
And paste it between “Source 10” and “Source 6”.
Step 58:
This is how it looks after paste.
Step 59:
Couse I get 2 red CROSS simbols. I click on the source and click IMPORT
Step 60:
The same with this code. I click on the source and click IMPORT
Step 61:
I copy “Source 17” just this part of the code.
Step 62:
And I paste it inside “Source 11” after "if (listView == null) "
Step 63:
This is how it looks after paste.
Step 64:
I go to the tutorial and copy “Source 18”
Step 65:
I go inside “Project Explorer” right click on “SRC” map, and paste it over.
Step 66:
Pops up that this file already exist. And I Overwrite it.
Step 67:
This is how it looks “Source 18”
Step 68:
Now I want to check if everything is running right. I choose “Run on server”
Step 69:
Just finish button.
Step 70:
And “voilá!” this is how it looks when we run it.!
Chapter 3.4
: Right now in this moment Am not “exactly” what´s going on. So wait some days, so I gonna bring back how to put this peces togheter.
3 - Questions
Question 1: (Why doesn´t look exactly the “Tutorial result” against result on “step 21”?