Home > Others

Velocity's layout function

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

first, from Velocityviewservlet to Velocitylayoutservlet

When you use velocity to develop a Web application, you need to configure a velocity-provided velocityviewservlet to accept the forward access to the velocity template (that is, the VM file) in XML. Velocityviewservlet is responsible for setting the attribute "read out" and the template file in the request to merge to form the final page, which is displayed to the response output on the user's computer.

Velocityviewservlet is a simple and easy to use. But as long as the Velocityviewservlet in the Web. XML is replaced with Velocitylayoutservlet, and configured on 2, 3 words, will have a simple layout of the page function. And this feature is actually very powerful.

second, Velocitylayoutservlet can ...

Velocitylayoutservlet can be used to simplify the development of page layouts under velocity.
With Velocitylayoutservlet, you can make the page appear as part of a page layout automatically when forward to a page. For example, access to User Data page, can automatically put the head of the site, tail and so on automatically output display processing.

third, velocitylayoutservlet use orderly

Several page layouts are set up in the system: Head (header), left menu area (sub), Middle right page Content section (main), Bottom (footer).

1.

Create the file [WebApp HOME]/VM/LAYOUT/LAYOUT.VM as follows:


Java code
  4. <! DOCTYPE HTML public "-//W3C//DTD HTML 4.01 transitional//en" >
  6. http://www.w3.org/1999/xhtml" xml:lang="en" >
  10. ... Omitted...
  14. <body>
  16. <div id= "header> #parse (' VM/LAYOUT/HEADER.VM ') </div>
  18. <div id="Content" >
  20. <div id="Sub" > #parse ($sub) </div>
  22. <div id="main" > $screen _content</div>
  24. </div>
  26. <div id="Footer" > #parse (' VM/LAYOUT/FOOTER.VM ') </div>
  28. </body>


$screen _content is equivalent to a placeholder, the content of the target page that is forward is substituted for that content.
#parse ($sub): Indicates that the sub position can be set dynamically through the $sub variable.

Also create ' VM/LAYOUT/FOOTER.VM ' ' VM/LAYOUT/HEADER.VM ' of these two files.



2.
Create WEB-INF/VM/USER/PROFILE.VM as follows: (assuming that the page is used to display the user's profile information)

Java code
    2. #set ($layout = "LAYOUT.VM")
    3. #set ($sub = "VM/USER/SUB.VM")
    4. A:what ' s your name?<br>
    5. B:my name is $user. loginname!



Note that this file is not the same as the normal my VM is in the first two words.
The first sentence sets which layout the page uses.
The second sentence sets the sub's value for the layout to include in the Vm/user/sub.vm file.


Also create a "VM/USER/SUB.VM" file

3. Configuring the Velocity.properites File

Using velocity is generally required to configure velocity.properites, at least input.encoding and output.encoding should be set. In this file, add the following code:

Java code
    1. # Directory for layout templates,
    2. # relative to Web application root directory
    3. Tools.view.servlet.layout.directory = vm/layout/
    5. # Filepath of the default layout template
    6. # relative to the layout directory
    7. #  !!!!! Dude, pay attention to this line. Tip: Relative to the root directory of the WEBAPP!!!!
    8. Tools.view.servlet.layout. default.template = LAYOUT.VM



4. Make sure that the Web. XML configuration is similar to the following (mainly configuration Velocitylayoutservlet, not Velocityviewservlet):

Java code
  2. <servlet>
  4. <servlet-name>velocity</servlet-name>
  6. <servlet-class>
  8. Org.apache.velocity.tools.view.servlet.VelocityLayoutServlet
  10. </servlet-class>
  14. <init-param>
  16. <param-name>org.apache.velocity.toolbox</param-name>
  18. <param-value>/WEB-INF/toolbox.xml</param-value>
  20. </init-param>
  22. <init-param>
  24. <param-name>org.apache.velocity.properties</param-name>
  26. <param-value>/WEB-INF/velocity.properties</param-value>
  28. </init-param>
  30. </servlet>
  32. <servlet-mapping>
  34. <servlet-name>velocity</servlet-name>
  36. <url-pattern>*.vm</url-pattern>
  38. </servlet-mapping>



5, run the server bar,
A) Visit HTTP://WWW.XXX.COM/VM/USER/PROFILE.VM to see the effect.

b) Go back to the VM/USER/PROFILE.VM file and remove the #set ($layout = "LAYOUT.VM") to see the effect.

Effect comparison:
Add the Profile.vm file that $layout set, when browsing this page, will automatically turn the page into a part of the layout, the HEADER.VM,SUB.VM,FOOTER.VM also output, remove $layout settings after browsing, just output the page, The HEADER.VM,SUB.VM,FOOTER.VM is not output.

This feature is very handy when debugging and writing.



Each time you add a new page, you can easily have simple layout features by simply setting the $layout point to a layout template on the first line (note the path to the layout template, and the 3rd step has been prompted).



6, after the language:

have been thinking of implementing a similar function, and finally, after a closer look at the Velocity official website, we found that velocity was already there. I think it's good, it fits my needs.

So, if you use or are about to use velocity to develop systems, it is highly recommended to use the layout feature.

Velocity's layout function

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

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

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

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

    Open a Ticket

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

    Learn More