• 所属类目:Director教程
  • 更新时间:2006-04-21 01:01:01
  • 关键词:对话框 director xtra mui
  • 浏览次数:(今日:,本周:,本月:

分享到:

作者:jerrowolf   出处:奥古多媒体
转载请联系作者和相关出处

  Director中非常有用的一个Xtra是MUI Dialog Xtra,这是D自代的对话框生成器。在6.0版本中就有这个Xtra了,但是很奇怪大多开发者都只应用了它最基本的特性,如果他们能否充分利用MUI Xtra的话,那么,你就可以自己定义个完全响应的对话框,而不是去用很废内存和磁盘空间的MIAW来实现。你可以去任意定制它,并且你可以完全根据你或者你的客户的需要来定义这个对话框如何去响应。可以说,你可以完全定制自己所需要的对话框,只有少数例外,那么这篇文章就来教你如何开始。



(你可以使用这些Lingo程序来生成特定平台的对话框)

  对话框种类

  你可以用MUI Xtra来产生两种对话框:“标准”对话框和“常规应用”对话框。“标准”类对话框由标准警告框、打开和保存对话框组成。Macromedia已经将这种对话框成为“系统对话框”,他们还添加了一个输入URL的对话框。毫无疑问,我们开发人员都会经常使用这种标准对话框,因为它们是已经完全定义好了的。我们只需要定义很少的一些参数,很少的几行lingo程序就可以创建他们,你只需要定义个属性列表来配置一下对话框,就可以用alert(),fileopen(),filesave(),getURL()方法来调用。关于使用标准警告对话框请参考
Multimedia Handyman artical。

  如果这四种对话框都不能满足你的要求的话,你就需要创建一个“常规应用”的对话框。这种对话框为开发者提供了更为广泛的控制,包括内容,版式设计,方法。如果你所需要的对话框包含一组单选按钮(radio buttons)、多选按钮(checkboxes)、弹出列表框、文本输入框、文本标签、滑块、按钮或者图形,那你就需要用“常规应用”对话框来定制。当然,你可能要花费一定时间来创建他们,这由你的对话框复杂程度决定。所用的Lingo语言也很直观。



(为你的程序添加一个选项对话框)

  你可以这么想,用MUI Xtra来创建一个“标准”对话框就好像应用MUI的第一层,而创建“常规应用”对话框就好像应用MUI的第二层,稍微费力一些,但是仍然需要“第一层”应用的基础。

  MUI 第二层:为对话框定制数据库

  几年前我用Excel的宏语言和对话框编辑器来为我的第一个程序创建对话框,当我看到它运行的时候,我觉得,用一个由数字和字符串组成的数据库来描述对话框,是很不错的主意(翻译可能有错)。我所做的就是为对话框写一些描述信息,然后嵌入我的程序中,而对话框就是由这些数据来驱动的。
[page_break]   MUI Xtra也允许你这么做:建一个数据库来描述对话框,然后在程序中运行,Lingo中能实现这个功能的就是属性列表,完全不需要那种由横线和竖线组成的表格。本质上来讲,你要做的就是写一个属性列表来描述对话框,然后告诉MUI Xtra来显示它。

  OK,下面这些就是你大概要做的步骤:

  1,创建一个MUI Xtra实例。
  2,建立一个属性列表来描述对话框窗口。
  3,建立一个属性列表来描述对话框内容。
  4,显示对话框。

  你可以将这些步骤全部写在一个电影脚本的句柄里。下面我们逐个步骤来讲。

  第一步:建立MUI实例

  这一步是应用Xtra最普通的步骤,但是在这里,你应该将这个MUI实例声明为全局变量,用new()方法来创建一个实例,然后用objectp()来检查是否创建成功:
-- 1. Create a MUI Xtra instance
global oDialog

if not( objectP( oDialog )) then
  
  oDialog = new( xtra "MUI" )
  if not( objectP( oDialog )) then
    oDialog = 0
    alert "ERROR: Xtra instance failure."
    exit
  end if
  
end if

  如果失败的话,可能是因为你的Xtras文件夹中没有这个Xtra,从你的Director Xtras目录中拷贝一个放在你的Xtras目录中,就OK了。

  当你创建实例之后,它自己会创建一些默认的属性列表来描述你的对话框。你可以用getWindowProplist(),getItemproplist(),getWidgetlist()来获得这些列表。这些方法每次返回的列表都是相同的,你所需要做的就是根据你的需要来改变这些列表。我们马上开始。

  第二步:设置窗口属性。

  告诉MUI你所需要的对话框窗口是一个简单的、分两部分的。第一部分,需要包含一个用getWindowPropList()获得默认的窗口的属性列表。这部分是所有对话框都相同的,但是第二部分将根据具体对话框来改变一些属性。在第二部分,你需要根据你的需要来改变第一部分那个属性列表:

lsWindow = oDialog.getWindowPropList()


After this line is executed, the value of lsWindow is

[ #type: #normal,
  #name: "window",
  #callback: "nothing",
  #Mode: #Data,
  #xPosition: 100,
  #yPosition: 120,
  #width: 200,
  #height: 210,
  #modal: 1,
  #toolTips: 0,
#closeBox: 1,
  #canZoom: 0 ]

  再重申一次,getWindowProplist()方法每次都得到相同的结果,如果你不想改,就不需要改。你可以用getWindowPropList()很容易的获得窗口的默认状态,所以你不需要每次都重新建立这个列表。现在,你所以需要的就是根据你的需要更新这个列表。

lsWindow.name = "My Dialog Box"
lsWindow.callback = "myDialogCallback"
lsWindow.xPosition = -1
lsWindow.yPosition = -1
lsWindow.width = 0
lsWindow.height = 0

  在上面这个例子,通过设置#name来让对话框的标题栏显示"My Dialog Box";设置#xPosition,#yPosition为-1是为了让对话框显示在屏幕中央。设置#width,#height为0是为了自动设置对话框尺寸,具体值由这个对话框所包含的元素决定。设置#callback是要告诉Xtra当在这个对话框上进行交互的时候,响应的句柄名。在第四步时会详细讲解这个句柄。

  注意#type属性有三个可选的值:#normal,#alert,#palette。默认是#normal,我个人从来未发现他们三个之间的区别,无论是在苹果还是在PC上。我相信不是这个Xtra中没有赋予#alert,#palette全部的功能,也许是我还没有努力研究他们的应用吧(自己翻译的,也许不是这个意思)。

  另外还有其他一些属性不起作用,比如#tooltips,还有一些不能通用于所有平台,如#closebox,#canzoom。
  本文不会对这些做任何解释,你可以在MUI的帮助文件中查询,最好自己试一下。

  最后,#mode属性也有3个可选值:#data,#pixel,#dialogunit。这些值决定MUI如何排版对话框,默认的#data模式,MUI将不会做任何排版工作,#pixel模式中会给你提供像素级的排版控制。#dialogunit模式也允许你精确的控制,但是对话框单元会随着系统字体的改变而变化。我发现最简单的就是用#data或者#pixel模式。
[page_break]   第三步:安排对话框内容

  尽管不难,但这是最费时的步骤。当你完成之后,你会发现,在你写描述对话框代码之前先画一个草图会对你很有帮助。




  这是一个几乎包含了所有元素的对话框。

  你应该记得在第二步中,你为窗口定义了一个属性列表叫做lswindow。为了描述对话框的内容,你应该建立一个线性列表,来包含在你的对话框出现的每一个元素。也就是说,你要建一个list列表来描述可见的和不可见的所有组件。

  开始定义一个空的表:

lsDialog = []

  还记得定义lsWindow时的两个部分么?我们在这里也要用相同的方法来定义lsDialog列表。先用getItemPropList()方法获得默认的元素属性列表,然后改变它,然后添加(最好先复制)到一个list列表中。还不明白么?那好,我们现在就添加一个元素,你会发现其实很简单。

formatter = oDialog.getItemPropList()

  这行执行后,formatter的值应该是:
[ #value: 0,
  #type: #checkBox,
  #Attributes: [],
  #title: "title",
  #tip: "tip",
  #locH: 20,
  #locV: 24,
  #width: 200,
  #height: 210,
  #enabled: 1 ]

  你希望第一个组件不是一个复选框,所以你应该改变它的#type属性,然后复制formatter,然后添加到lsDialog中。

formatter.type = #windowBegin
lsDialog.append( formatter.duplicate() )

  恭喜!你已经向你的对话框添加了一个组件了。从这里开始,你就可以用同样的方法添加任何组件,只要你愿意。现在我们来看看要添加所有组件的程序:

-- 添加一个不可编辑的标签
widget = oDialog.getItemPropList()
widget.type = #label
widget.value = "My dialog will display this text."
lsDialog.append( widget.duplicate() )

-- 添加一个文本框
widget = oDialog.getItemPropList()
widget.type = #editText
widget.value = "Default text"
lsDialog.append( widget.duplicate() )

-- 添加一个复选框
widget = oDialog.getItemPropList()
widget.type = #checkBox
widget.title = "My Checkbox"
widget.value = TRUE -- checked by default
lsDialog.append( widget.duplicate() )

-- 添加一个单选框
widget = oDialog.getItemPropList()
widget.type = #radiobutton
widget.title = "My Radio Button"
widget.value = TRUE -- checked by default
lsDialog.append( widget.duplicate() )

-- 添加一个标准的按钮
widget = oDialog.getItemPropList()
widget.type = #defaultPushButton -- or #pushButton
widget.title = "OK"
lsDialog.append( widget.duplicate() )

-- 添加一个位图成员
widget = oDialog.getItemPropList()
widget.type = #bitmap
widget.value = member("myDialogGraphic")
lsDialog.append( widget.duplicate() )

-- 添加一个滑动条
widget = oDialog.gettemPropList()
widget.type = #integerSliderH -- or #floatSliderH
attributeList = [:]
attributeList.addProp( #valueRange, [ #min:1,#max:100,#increment:1 ] )
attributeList.addProp( #sliderStyle, [ #ticks,#value ] )
attributeList.addProp( #layoutStyle, [ #left ] )
widget.attributes = attributeList
widget.value = 50
lsDialog.append( widget.duplicate())

-- 添加一个弹出列表框
widget = oDialog.getItemPropList()
widget.type = #popupList
valList = [ "640 x 480", "800 x 600", "Full Screen" ]
popList = [ #normal ]
layList = [ #left,#minimize ]
attributeList = [ #popupStyle:popList, #valueList:valList, #layoutStyle:layList ]
widget.attributes = attributeList
widget.value = valList[ 3 ]
lsDialog.append( widget.duplicate() )
[page_break]   如果你仔细看一下,你会发现每次添加组件都是非常直观并且很容易通用。这些例子中只有滑动条和弹出列表框有#attributes属性,其他则没有,可配制的属性有 #textSize, #textStyle, #textAlign,

#bitmapStyle, #sliderStyle, #valueRange, #popupStyle, #valueList, #layoutStyle,.

  注意如何通过改变#attribute的值来改变个别组件的外观。



  定制你的对话框需要定义#types属性的包括:用来划分组件分成横向组和竖向组的元素;垂直和横向的分隔线;对话框窗口开始和结束处的标志。

  如果你希望在你的对话框中设计横向组和竖向组,那很容易,例如,如果你想把两个单选框组成一个竖向组,你就可以做这么一个嵌套:

#groupVBegin
#radioButton1
#radioButton2
#groupVEnd

  要向你的对话框添加这组按钮,只需重复以前的工作,把他们的列表逐个添加到lsDialog中:

-- 竖向组开始
formatter = oDialog.getItemPropList()
formatter.type = #groupVBegin
lsDialog.append( formatter.duplicate() )

-- 添加第一个单选框
widget = oDialog.getItemPropList()
widget.type = #radioButton
widget.title = "Radio Button One"
widget.value = TRUE -- this button is "on" by default
lsDialog.append( widget.duplicate() )

-- 添加第二个单选框
widget = oDialog.getItemPropList()
widget.type = #radioButton
widget.title = "Radio Button Two"
widget.value = FALSE -- this button is "off" by default
lsDialog.append( widget.duplicate() )

-- 竖向组结束
formatter = oDialog.getItemPropList()
formatter.type = #groupVEnd
lsDialog.append( formatter.duplicate() )

  注意:这些定制都是成对出现的,例如,你用#groupVBegin开始就必须用#groupVEnd结束,#groupHBegin和#groupHEnd也是如此,#windowBegin和#windowEnd也是这样。

  有些组件没有#title属性,那就需要用一个#label做标签来描述,然后将他们两个分到一个组中,也就是说,单选按钮、复选框有这种文本式的标签,而滑块和弹出列表框则没有,所以如果你想包含一个滑块或者弹出列表框在你的横向组中,你就需要向这个横向组中添加一个嵌套的组。(我的理解就是说可以嵌套)

#groupHBegin
#label -- "Jpeg Quality:"
#integerSliderH
#groupHEnd

  如果这些定制还不够精确的话,你可以将lsWindow中的#mode设置成#pixel.
[page_break]   第四步:显示对话框

  这可能是四步中最简单的了,现在你已经建立了描述窗体和对话框内容的列表,将他们传给initialize()方法,那么就显示了对话框。

initialize oDialog, [ #windowPropList: lsWindow, #windowItemList: lsDialog ]
run oDialog

  好了,现在来讲讲对话框的响应问题,很多废话就不翻译了。现在你的对话框还不能退出,因为你没有定义它的响应句柄。只能按ESC来退出。

  第四步半:建立callback句柄

  在你的对话框中所发生的每一个MUI定义的事件,它都会发送3个信息给你自定义的callback句柄。

  1.事件类型(symbol)
  2.组件在#windowitemlist中的位置(integer)
  3.这个组件的属性列表(property list)

  callback句柄的第一句是这样的:(这里也许包含你不需要理会的事件)

on myDialogCallback event, eventData, itemPropList
  
  if symbolP( event ) then
    
    case event of
      #windowOpening, #windowClosed:
        exit
        
      #windowZoomed, #windowResized:
        exit
        
      #itemEnteringFocus, #itemLosingFocus:
        exit
  你的callback句柄应该主要由case语句来组成,由case来区分不同的组件响应,将以下程序写在case的最外边:
        
        
      #itemChanged:
        case itemPropList.type of
            
          #checkBox, #radioButton:
            put itemPropList.title & ":" && itemPropList.value
            
          #editText:
            put itemPropList.value
            
          #integerSliderH, #floatSliderH:
            put itemPropList.value
            
          #popupList:
            put itemPropList.value
        end case
        
      #itemClicked:
        case itemPropList.type of
            
          #defaultPushButton: oDialog.stop( TRUE )
          #pushButton: oDialog.stop( TRUE )
          #cancelPushButton: oDialog.stop( TRUE )
            
        end case
        
    end case
    
  end if
  
end

  这个callback句柄起码会让你点击关闭这个对话框。并且会在message窗口显示响应的结果,你可以看看itemUpdate()命令,它是用来在交互中刷新组件的。

  还有很多很有趣的应用,比如为你的程序添加一个preferences或者Options对话框,登陆对话框,或者其他什么的,但很不幸的是:MUI Xtra 在Shockwave中很不安全,所以你不能把它应用在浏览器中。

评论

相关下载

推荐下载