2006年9月23日星期六
6、Alternate Row Colors
在使用该插件之前我们要确定页面上有一个表格、一个记录集和一个重复区域,如图 12.218 所示。
安装完插件后要重新启动MX,选择页面上的重复区域后在“应用程序”面板上点击“服务器行为”选项卡。在“服务器行为”选项卡上点击“+”按钮,在下拉菜单中选择“Technocurve > Alternate Row Colours”选项,如图 12.219 所示。
此时会弹出如图 12.220 所示的“Alternate Row Colours”设置对话框。
First Colour:第一行表格的颜色。
Second Colour:第二行表格的颜色。
tr tag:标记。
Select correct row:选取适当的行。
设置完成后点击“确定”。
在浏览器测试效果你会发现表格的背景颜色发生了交替变化的颜色。这是该插件的一个简单的功能,还有更强大的功能我们现在来介绍它。
同样在“服务器行为”选项卡上点击“+”按钮,在下拉菜单中选择“Technocurve > Alternate Row Colours MouseOver”选项,如图12.221所示。
First Colour:第一行表格的颜色。
Second Colour:第二行表格的颜色。
First MouseOver Colour:第一行鼠标经过时的颜色。
Second MouseOver Colour:第二行鼠标经过时的颜色。
Select correct tr tag:选取恰当的标签。
The first on the page will be :首行在页面上必须是tr[0]或tr[1]。
In a 2 row table,the second row is:在一个2行的表格里,第二行是。
设置完成后点击“确定”。
在浏览器中测试效果如图 12.222 所示。
当鼠标经过表格的第一行时你会发现它的颜色改变了,如图 12.223 所示。
当鼠标经过表格的第一行时你会发现它的颜色改变了,如图 12.224 所示。
7、Horizontal Looper PHP
该插件的功能是可以设置记录集横向显示。
在使用插件之前首先要创建一个记录集,我们来使用动态表格创建。在对象面板上选择“应用程序”选项卡,在“应用程序”选项卡时点击动态表格图标,如图 12.225 所示。
此时会弹出设置说明对话框。
注意,该对话框的“确定”按钮是灰的,正明当前的页面是没有记录集的页面。
如果你还没有创建站点的话可以点击“站点”来创建。你同样可以选择“文档类型”来选择或更改文档,也可以选择“测试服务器”来更改服务器的设置。
在这里我们是要创建一个动态表格,所以点击创建“记录集”。此时会弹出如图 12.227 所示的“Recordset”设置对话框。
“Recordset”设置对话框我们已经讲过很多遍了,在这里就不再重复了。按钮图设置完成后点击“确定”。此时的设置说明对话框上的“确定”按钮变成可以使用的状态了,如图 12.228 所示。
这时点击设置说明对话框上的“确定”按钮,随后会弹出如图 12.229 所示的动态表格设置对话框。
动态表格设置对话框使用默认设置即可,点击“确定”按钮完成动态表格的设置。
由于我们要使用“Horizontal Looper PHP”插件的横向重复区域功能,所以动态表格自动产生的“重复区域”就要删除。在“服务器行为”面板点击“重复区域”,如图 12.230 所示。
点击服务器行为面板上的“_” 按钮删除该行为。删除后的“服务器行为”面板如图 12.231 所示。
现在我们来使用“Horizontal Looper PHP”插件的横向重复区域功能,如图 12.232 所示的选择“Horizontal Looper MX”选项。
此时会弹出如图 12.233 所示的“Horizontal Looper MX”设置对话框。
Recordset:选择记录集。
Show:显示。
Rows:横排。
Columns:竖排。
All Records:全部记录。
设置完成后点击“确定”。
此时页面上会显示一个嵌套表格,如图 12.234 所示。
在浏览器中测试效果如图 12.235 所示。
2、Smart Image Processor
注意:你的服务器系统必须支持“Smart Image Processor”,检测方法在这里 Server Check!
这个插件是接着前面的“Pure PHP Upload”插件写的,在完成了“Pure PHP Upload”上传图片的功能后,我们打开“picture.php”页面,如图 12.197 所示。
在这个页面的基础上我们来使用“Smart Image Processor”插件。安装完成后在“服务器行为”面板上点击“+”按钮,在下拉菜单中选择“DMXzone > Smart Image Processor”选项,如图 12.198 所示。
此时会弹出“Smart Image Processor”设置对话框,如图 12.199 所示。
Smart Image Processor Options:精确的图片处理器选项。
Use Server Component:使用服务器成份。
Resize Uploaded Images:调整上载后的图片大小。
Width:宽。
Height:高
Quality:品质。
Keep Aspect ratio:保持比例。
Make Thumbnails:制造极小的。
Thumbnail Path:选择路径。
Suffix:后缀。
Prefix:前缀。
After resize:高速大小之后。
完成设置之后点击“确定”。记住要上传该页及相关文件。
注意:再次提醒该插件一定要服务器支持才可以正常使用。
3、Visit counter
该插件的功能是为你创建一个网页计数器,可以防止刷新。
安装完插件后在“服务器行为”面板点击“+”按钮,在下拉菜单中选择“FELIXONE > Visit counter”选项,如图 12.200 所示。
此时会弹出如图 12.201 所示的“Visit counter”设置对话框。
File Name:文件名。
Digits Number:选择显示几位数字。
Start From:从几开始。
Update Count:更新计数。
Once per session:每个“session”更新一次,防止刷新。
Any time:任何时间更新。
设置完成后点击“确定”。在浏览器中测试效果如图 12.202 所示。
4、Random Region
该插件的功能是随机显示记录,当你刷新一次页面就重新显示一个记录。
安装完插件后创建一个新的页面,在使用插件前要先创建一个记录集。在“应用程序”面板点击“绑定”选项卡,在“绑定”选项卡里选择“记录集(查询)”如图 12.203 所示。
图 12.203 选择“记录集(查询)”
此时会弹出“Recordset”设置对话框,如图 12.204 所示。
Name:记录集名字。
Connection:连接数据库。
Table:选取数据表。
Columns:纵栏。
All:全部。
Selected:选取。
Filter:过滤。
Sort:种类。
设置完成后点击“确定”按钮。
此时点击“应用程序”面板上的“服务器行为”选项卡。在“服务器行为”选项卡上点击“+”按钮,在下拉菜单中选择“Random Region”选项,如图 12.205 所示。
图 12.205 选择“Random Region”选项
选择要显示的记录集后点击“确定”按钮完成设置。打开浏览器测试效果如图 12.207 所示。
点击刷新按钮后会显示另外一个记录,如图 12.208 所示。
5、Navigation Builder
该插件的功能是为你设置类似“prev 1 2 3 4 next”或“1-10 11-20 21-30”的导航栏,该插件的功能比MX自身的导航功能强大的多。
在使用该插件之前,必须先建立一个记录集和一个重复区域。首先我们在新的页面里在创建一个记录集。在“应用程序”面板上点击“绑定”选项卡,在“绑定”选项卡上点击“记录集(查询)”,如图 12.209 所示。
此时会弹出“Recordset”设置对话框,如图 12.210 所示。
Name:记录集名字。
Connection:连接数据库。
Table:选取数据表。
Columns:纵栏。
All:全部。
Selected:选取。
Filter:过滤。
Sort:种类。
Descendint:降序。
设置完成后点击“确定”。
在页面上插入一个表格,把记录集插入到表格中后点选项这个表格,我们来为其设置重复区域。如图 12.211 所示。
此时在“应用程序”面板上点击“服务器行为”选项卡,在“服务器行为”选项卡上点击“+”按钮,在下拉菜单中选择“重复区域”选项。如图 12.212 所示。
此时会弹出“重复区域”设置对话框,如图 12.213 所示。
设置完成后点击“确定”。
设置完成后在页面中的显示效果如图 12.214 所示。
现在我们来开始使用“Navigation Builder”导航插件。在安装完插件后注意,要重新启动 MX,否则可能会出现错误,导致程序无法运行。
然后在“应用程序”面板上点击“服务器行为”选项卡,在“服务器行为”选项卡上点击“+”按钮,在下拉菜单中选择“Sephiroth > Navigation Builder”选项,如图 12.215 所示。
此时会弹出如图 12.216 所示的“Navigation Builder”设置对话框。
图 12.216“Navigation Builder”设置对话框
Text for the “Next” link:设置显示下一页的文字链接。
Text for the “previous” link:设置显示上一页的文字链接。
Results display mode:设置显示方式。
page number:页号方式。
results range:排列方式。
Select the default separator text between page numbers:选取一个页号和页号之间的隔离符号。
Select to which recordset apply the Navigation Builder:选取那个需要导航的记录集。
Recordset:记录集。
Max number of links to display:最多显示多少页的链接号码。
完成设置后点击“确定”。
在浏览器中测试效果如图12.217所示。
12.4 服务器行为插件
该插件的功能是把图片上传到你的站点上。
在使用该插件之前我们首先要建立一个数据库和一个数据表。按照前面讲过用MySQL_Front 创建一个名为“test”的数据库,在该数据库里创建一个名为“picture”的数据表。该数据表的字段设置如图 12.179 和 12.180 所示。
数据表建完后安装“Pure PHP Upload”并重新启动 MX。首先新建一个“picture”页面,在页面上添加一个表单,一个文件字段和一个提交按钮。如图 12.181 所示。
添加表单完成后我们要先为其添加插入数据的服务器行为,该行为是 MX 自带的功能。
在“应用程序”面板上点击“服务器行为”选项卡,点击“+”按钮,在下拉菜单中选择“插入记录”行为,如图 12.182 所示。
此时会弹出如图 12.183 所示的“插入记录”设置对话框。
提交值,自:默认设置“form1”
连接:选择“test”数据库。
插入表格:选择“picture”表格。
列:如果你文本域的名字和数据表字段的名字对应的话 MX 会为我们自动配对。
值:是指文本域的名字。
提交为:是指数据表里对应字段的输入方式。
插入后,转到:选择插入后要转向的页,这里选择“detail.PHP”。
设置完成后点击“确定”,接下来选择“Pure PHP Upload”行为,如图 12.184 所示。
此时会弹出如图 12.185 所示的“Pure PHP Upload”设置对话框。
Main:主体。
Upload Options:上传选项。
Upload Folder:选择上传到哪个文件夹。
Allowed Extensions:允许上传文件的扩展名。
All:全部。
Images:图片的扩展名。
Custom:定制。
Require Upload:要求必需上传。
Filename:文件名。
Store Filename Only:只保存文件名。
Prefix With Full Path:保存上传的全部路径。
Conflict Handling:操作冲突。
Overwrite:超过。
Timeout:超过一定的时间将停止上传。
Limit Upload Size to:限制上传的尺寸。
KBytes:千字节。
Get Files From:获取文件的表单。
After Uplading:上传完之后。
Go To:指向要去的页面。(不要选择)
设置完成后点击“确定”按钮。
“Pure PHP Upload”插件的功能非常强大,我们下页介绍一下它的高级设置。
在“Pure PHP Upload”插件面板上点击“Advanced”高级设置选项卡。此时会出现如图 12.186 所示的“Advanced”设置对话框。
Image Size Limit:限制图片尺寸。
Min Width:最小宽度。
Min Height:最小高度。
Max Width:最大宽度。
Max Height:最大高度。
Save the Image Properties in Hidden Form Fields:保存图片属性在隐藏表单域。
Save Width In:选择保存宽在隐藏表单域里。
Save Height In:选择保存高在隐藏表单域里。
Progress Bar:进度条。
Use Progress Template:使用进度条模板,选择一个模板后点击右边的“Preview”预览按钮后弹出如图 12.187 所示的模板样式。
图 12.187 所示的模板样式
Window Width:窗口的宽。
Height:高。
在上传图片页面制作完成后现在该制作浏览页面了。
首先创建一个“browser”页面,然后在该页面上创建一个记录集。如图 12.188 所示。
Name:填入记录集名字。
Connection:连接数据库。
Table:选取表格。
Columns:纵栏。
All:全部。
Selected:选取。
Filter:过滤。
Sort:种类
设置完成后点击“确定”。
在对象面板的“常用”选项卡时面点击插入图像的图标,如图 12.189 所示。
此时会弹出“选择图像源”设置对话框。(注意:在点选“数据源”。)在对话框中选择“picture”字段,如图 12.190 所示。
此时要注意URL一栏中自动添加了一行代码,这行代码是 MX 自动为我们添加显示图片的路径。由于我们存放图片的文件夹是“upload”所以要在代码前面加上“/upload/”来指定图片的路径。
完成后点击“确定”。
此时页面上会出现显示动态图片的图标,如图 12.191 所示。
由于我们有些时候可能会上传多幅图片,所以我们可以为它添加“重复区域”行为。
首先点击这个显示动态图片的图标,然后在“服务器行为”面板上点击“+”按钮,在弹出的下拉菜单中选择“重复区域”行为。如图 12.192 所示。
此时会弹出如图 12.193 所示的“重复区域”设置对话框。
选择所有记录,点击“确定”完成设置。
设置完成后的“picture”如图 12.194 所示。注意:页面上的布局表格是添加的记录集,你可以不用添加记录集而只显示图片。
最后我们来测试这个上传图片的功能。首先在浏览器中打开“picture”页面,点击浏览选择一幅图片后,按钮“提交”按钮。如图 12.195 所示。
此时会转到图片显示页,如图 12.196 所示。证明上传图片成功。