WebBuilder学习记录.docx

WebBuilder学习记录.docx

《WebBuilder学习记录.docx》由会员分享，可在线阅读，更多相关《WebBuilder学习记录.docx（31页珍藏版）》请在冰豆网上搜索。

WebBuilder学习记录

WebBuilder是一款跨平台、数据库和浏览器的可视化Web应用开发平台。

WebBuilder使用了多项最新的技术，使Web应用的开发更快捷和简单。

一、安装方法

　　1、安装任意类型的一款JAVAWeb应用服务器（如Tomcat）和数据库（如MySql），并且在Web应用服务器中创建一个JNDI链接串，以访问所创建的数据库。

　　2、解压缩下载的安装包webbuilder.zip，并把wb目录部署到Web应用服务器。

例如，您使用Tomcat，那么可直接复制wb目录至Tomcat的webapps/wb目录。

　　3、打开浏览器并访问[http:

//ip:

port/wb]，使用安装向导来完成WebBuilder的安装。

例如，访问http:

//localhost:

8080/wb

4、使用管理员帐户登录到系统，管理员默认用户名称和密码均为admin。

HowtousePHPtocollectFormdata?

Beforeyoureadthistutorialpleasemakesureyouunderstandthebasicsofcreatingformsasexplainedinthisarticle:

CreatingForms.WeassumeyouhavealreadycreatedyourformandnowyournextstepwillbetocollecttheentereddataaftertheuserspressedtheSubmitbutton.

InthistutorialwewillusePHPtocollecttheformdata,becausethemailto:

actionwhichwasusedintheCreatingFormstutorialisnotthemostreliablewaytocollectdatainaform.

Formoredetailaboutthispleasereadthisarticle:

Notes:

•MakesureyourwebserversupportsPHPotherwisethissolutionwillnotwork!

•Quick'nEasyWebBuilderdoeshaveabuilt-inPHPformprocessor.Whenusingthatoptionyoudonotneedtowriteanycodemanually.***Recommendedforbeginners!

***

Step1

Createanewpageinandcallitfeedback.Thisisthepagethatwillbedisplayedafterthedatahasbeensubmitted,sothispagemaycontaina'thankyouforyoursubmission'messageoranyothercontentyouprefer.

Step4

Replaceyourname@withyourownemailaddress.

Step5

Gobacktothepagewithyourformandsettheactionpropertyoftheformtofeedback.php.

VerifythatthemethodissettoPOST. Alsoremovethecontentoftheencodingtypefieldsothatit'sempty.

Step2

OpenthepagepropertiesofthenewpageandsetthefileextensiontoPHP.

Step3

OpenMenu->Page->PageHTML,selectStartofPageandcopy/pastethiscode:

php

$mailto="yourname@";

$subject="Feedbackform";

$message="Valuessubmittedfromwebsiteform:

";

$header="From:

".$_POST['email'];

foreach（$_POSTas$key=>$value）

{

  if（!

is_array（$value））

  {

    $message.="\n".$key.":

".$value;

  }

  else

  {

    foreach（$_POST[$key]as$itemvalue）

    {

      $message.="\n".$key.":

".$itemvalue;

    }

  }

}

mail（$mailto,$subject,stripslashes（$message）,$header）;

?

>

Note:

Yourformshouldcontainafieldcalledemail,thisfieldwillbeusedassenderofthemailmessage!

Step6

Nowyoucanpublishthe2pagesandtestyourform.

Note:

YoucannottestaPHPformonyourlocalcomputer,thescriptshouldbeexecutedonawebserverwithPHPsupport!

Relatedarticles:

HowtousetheFormWizard?

二、使用WebBuilder来生成一个窗口

　　1、打开[开发套件]->[集成开发环境]模块，点击新建模块按钮，添加一个新的应用模块。

　　2、在控件列表中双击Window控件，来添加窗口，并设置autoShow属性为true，title属性为demo。

　　3、点击运行按钮，就能见到我们刚才添加的窗口。

功能强大的集成开发环境

在线的带语法分析和高亮的Java、JavaScript、ServerScript编辑器，所见即所得的表单设计器，强大的组件管理器和模块管理器，智能的对象探测器

整合的Portal

跨异构数据库的管理工具

在线表格编辑，高亮的SQL和语法分析，支持大数据量的访问，支持所有类型数据（包括BLOB）的导入导出

跨平台的远程服务器文件访问

使用资源管理器般的简单，就能轻松操纵远程服务器系统。

随心所欲的权限控制

能够对任意粒度的操作进行严格的权限控制。

企业级的后台任务管理

管理和控制后台计划任务稳定地运行。

WhatisnewinQuick‘nEasyWebBuilder3.0?

Thisdocumentprovidesabriefoverviewofwhatyoucanexpectinthismajornewrelease.Quick‘nEasyWebBuilder3.0hasmorethan100newfeatures/improvements.Thousandsofnewoptionsandpossibilities!

Here’salistofsomeofthesenewfeatures.

ResponsiveWebDesign

Withtheincreaseinpopularityofbrowsingonmobilephonesandtabletsitisbecomingessentialtocreatewebsitesthatareoptimizedtotheneedsoftheseusers.Previouslyyouhadtocreatedifferentversionsofthewebsiteandusescriptstoredirectthevisitortothemobileversionofthepage.Quick‘nEasyWebBuilder3introduces'ResponsiveWebDesign'whichallowsyoutocreateasingleHTMLpagecontainingdifferentvariantsofthelayout,eachoptimizedforspecificdevicewidths.Yourwebsitewilldynamicallyrespondtothescreensizeofthevisitoranddisplaythelayoutmostappropriatetotheirdevice.Thesedifferentvariantsarecalled'breakpoints'andthisconceptisbasedonCSS3'smediaqueries.

Abreakpointisseparate'view'ofthepageinQuick‘nEasyWebBuilder.Apagecanhavemultiplebreakpoints,eachoneoptimizedforaspecificscreenwidth.Forexample,youcanhavethestandarddesktoplayout,onefortablets（1024px）andanotheroneformobilephones（320px）.

Toadd,editorswitchbetweenbreakpointsclickthe'ManageBreakpoints'optioninthePagemenu.

Youcanalsousethe‘Breakpoints’toolbaratthebottomofthescreentoswitchbetweenbreakpoints.Togobacktothedefaultlayout,select'Default'.

CSS3animationsandtransitions

-Newfeature:

AddedCSS3animationandtransitionsupport!

Relatedtutorials:

-Newfeature:

AddedAnimationManager.Thiscanbeusedtodefineanimation（withkeyframes）forCSS3animations.Withmorethan90predefinedanimationstogetyoustarted.

-Newfeature:

AddedsupportforanimationsandtransitionsintheStyleManager.

-NewFeature:

Added'Animationtimeline'.Thiscanbeusedtodisplayallanimationsonthepage,soyoucaneasilyadd,editandremoveanimations.

-NewFeature:

Transformobjectswithanimationsandtransitions（forexampleonmouseover）:

skew,translate,rotate,scale.flipetc.

Header/Footer

-Newfeature:

AddedPageHeaderobject.Aneasywaytoaddafullwidthheadertoyourwebsite.Supports'fixed'and'fullscreenwithanimations'mode.

-Newfeature:

AddedPageFooterobject.Aneasywaytoaddafullwidthfootertoyourwebsite.Supports'fixed'and'fullscreenwithanimations'mode.

TimerObject

-Newfeature:

Added'Timer'object.Triggeractionsbasedontimerevents.ForinstanceshoworhideanobjectafterXmilliseconds.Timerscanalsostart/stopothertimers!

Alleventactionsaresupported.

WrappingText

-Newfeature:

Added'Wrappingtext'object.Thisobjectmakesitpossibletowraptextaroundobjects!

PanelMenu

-Newfeature:

Added'PanelMenu'.APanelMenuisinitiallyinvisible,butcanslidefromtherightorleftsideofthepagebyclickingthemenubutton.Manymodernwebsitesusethistypemenu.

Blog

-Newfeature:

Added'Blog'object.TheBlogobjectprovidesaneasywaytoimplementabasicblogonyourwebsitewithoutspecialrequirementsofthewebserver.

Generalfeatures

-Newfeature:

Theuserinterfacewasredesigned.Ithasnowamoremodernlookwithflattoolbarsandnew（flat）icons.

-Newfeature:

Addedpagenametothestatusbar,italsodisplaysthecurrentbreakpoint（forRWD）.

-Newfeature:

JavaScriptfunctionsnowalwaysuseanexternal（minified）file:

qwb3.min.js

-Newfeature:

Added'Events'and'Animations'buttonstotoolbarforquickaccesstothesefeatures.

-Newfeature:

AddedashortcutmenuitemtoinsertGoogleAnalyticscodeinthesectionofthepage.

-Newfeature:

Added'Defaults'inPageProperties.Hereyoucansetthedefaultfont（family/size/color）fornewobjectsinthecurrentpage.

-Newfeature:

Addedsupportforbackground-size（CSS3）inforbackgroundimages（includepagebackground）.Thismakesitpossibletosize/stretchbackgroundimagesinlayers,forms,buttonsetc.Supportscontain,cover,pixelsandpercentages!

-Newfeature:

Added'Margin’optiontoImage,Shape,Logo,RollOver,SlideShowandothers.Themarginclearsanareaaroundanelement（outsidetheborder）.Unlikepadding,themargindoesnothaveabackgroundcolor,andiscompletelytransparent.Thiscanusefulforobjectsinwrappingtexttoaddsomespacingaroundobjects.

-Newfeature:

Included（optional）supportforjQuery2.0.ThisversionofjQueryisfasterandsmaller,butdoesnotsupportInternetExplorer6,7,or8.jQuery1.11and1.7.1arealsostillsupported.

FindandReplace

-Newfeature:

Added'FindandReplace'tool.Thistoolcanbeusedtoquicklychangethecolor,font,urlorfilenameforallobjects（oraselection）onthepageorentirewebsite.

Publish

-Newfeature:

Added"Publishfilesofmodifiedobjectsonly'.Whenthisoptionisselected'publish'willonlyuploadthefilesofobjectsthathavebeenmodified.

Forexampleyouselectedadifferentimage.Thenonlythisimagewilluploaded.

Links

-Newfeature:

AddedFaceTimelinkoption.LaunchtheFaceTimeappandinitiateacalltothespecifieduser.

-Newfeature:

AddedPhoneNumberlinkoption.Callthespecifiednumber.

-Newfeature:

AddedSMSlinkoption.SendanSMS.

-Newfeature:

AddedSkypelinkoption.LaunchtheSkypeappandinitiateacalltothespecifieduser.

Text

-Newfeature:

AddedLorumIpsumTextgeneratortothetextobject!

Availableinthe'Edit'menuandthecontextmenuintexteditmode.

-Newfeature:

Addednewoutputformattotextproperties:

'Includeline-heightintextstyles',inmanycasesthiscreatesperfectlyalignedtextwithasmallcodefootprint;）

-Newfeature:

Addedsupportfor'text-shadow'intheStyleManager.Thisallowsyoutoaddshadowstotext（insupportedbrowsers）.Forperformancereasonsthetextwillnotberenderedwithshadowindesignview.Youmustprevieworpublishthepage!

YouTube

-Newfeature:

Added'ShowControls'option.Uncheckthistohidetheplayercontrol