注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

鑫淼梦园的博客

圆你的梦想 从这里开始

 
 
 

日志

 
 

Delphi XE4 iOS应用程序开发(2)  

2013-06-04 19:59:41|  分类: delphi xe4 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

实现用户更改日期的事件处理过程

在用户更改了日期之后,OnChange事件会被触发。你可以给OnChange事件实现一个事件处理过程来响应用户的动作。

要实现OnChange事件处理过程:

1. 选择TCalendarEdit组件。

2. Object Inspector中,打开Events页,然后双击OnChange后面的空白处。

3. 编写如下代码:

[delphi] view plaincopyprint?

1. procedure TForm25.CalendarEdit1Change(Sender: TObject); 

2. begin 

3. ShowMessage(FormatDateTime('dddddd', CalendarEdit1.Date)); 

4. end

procedure TForm25.CalendarEdit1Change(Sender: TObject);

begin

 ShowMessage(FormatDateTime('dddddd', CalendarEdit1.Date));

end;

4. 这段代码会弹出一个对话框,上面显示选择的日期。FormatDateTime函数转换选择的日期为一个指定格式(在这个例子中dddddd指的是长类型日期格式):

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

iOS应用程序中使用ComboBox组件来从列表中选择某一项

FireMonkey iOS应用程序中实现一个选择器

iOS平台上,FireMonkey使用TComboBox组件来封装选择器组件:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

要定义一个选择器并且列出可以选择的项目:

1. 选择File>New>FireMonkey Mobile Application – Delphi>Blank Application

2. 在Tool Palette中选择TComboBox组件,然后拖到FireMonkey Mobile Form Designer上去。

要找到TComboBox,在ToolPalette的搜索框中输入开头的几个字母(Com):

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

3. 在你拖好控件之后,你就可以在Form Designer上看到这个TComboBox组件了。

右击TComboBox组件,选择Items Editor…

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

4. 要定义项目列表,多点几次Add Item

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

5. 在Structure View中,选择ListBoxItem1(列表中的第一项)。

6. 在Object Inspector中,编辑ListBoxItem1Text属性。

在这个例子中,(USA55个州),第一项为Alabama

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

7. 也把其他项目编辑好,例如AlaskaArizonaArkansasCaliforniaColorado,等等。

8. 在iOS SimulatoriOS Device目标平台上运行这个应用程序。

你在点按TComboBox之后,Picker控件就会出现,之后你就可以选择一个项目了。

使用代码来建立项目列表

要用代码建立项目列表,你可以像下面的代码一样使用Add方法:

[delphi] view plaincopyprint?

1. procedure TForm27.FormCreate(Sender: TObject); 

2. begin 

3. ComboBox1.Items.Add('Alabama'); 

4. ComboBox1.Items.Add('Alaska'); 

5. ComboBox1.Items.Add('Arizona'); 

6. ComboBox1.Items.Add('Arkansas'); 

7. ComboBox1.Items.Add('California'); 

8. // Other states can be listed here 

9. ComboBox1.Items.Add('Virginia'); 

10. ComboBox1.Items.Add('Washington'); 

11. ComboBox1.Items.Add('West Virginia'); 

12. ComboBox1.Items.Add('Wisconsin'); 

13. ComboBox1.Items.Add('Wyoming'); 

14. end

15. 

16. 

procedure TForm27.FormCreate(Sender: TObject);

begin

  ComboBox1.Items.Add('Alabama');

  ComboBox1.Items.Add('Alaska');

  ComboBox1.Items.Add('Arizona');

  ComboBox1.Items.Add('Arkansas');

  ComboBox1.Items.Add('California');

  // Other states can be listed here

  ComboBox1.Items.Add('Virginia');

  ComboBox1.Items.Add('Washington');

  ComboBox1.Items.Add('West Virginia');

  ComboBox1.Items.Add('Wisconsin');

  ComboBox1.Items.Add('Wyoming');

end;

 

显示指定的项

当前选中的项由ItemIndex属性指定。ItemIndex是一个整型值,使用从0开始的下标来指定(也就是,第一个项的下标是0)。

要显示延列表中第5项为选中(在下面的示例代码中是California),指定它的ItemIndex如下:

[delphi] view plaincopyprint?

1. procedure TForm27.FormCreate(Sender: TObject); 

2. begin 

3. ComboBox1.Items.Add('Alabama'); 

4. ComboBox1.Items.Add('Alaska'); 

5. ComboBox1.Items.Add('Arizona'); 

6. ComboBox1.Items.Add('Arkansas'); 

7. ComboBox1.Items.Add('California'); 

8. // Other states can be listed here 

9. 

10. // Index of 5th item is "4" 

11. ComboBox1.ItemIndex := 4

12. end

13. 

14. 

procedure TForm27.FormCreate(Sender: TObject);

begin

  ComboBox1.Items.Add('Alabama');

  ComboBox1.Items.Add('Alaska');

  ComboBox1.Items.Add('Arizona');

  ComboBox1.Items.Add('Arkansas');

  ComboBox1.Items.Add('California');

  // Other states can be listed here

 

  // Index of 5th item is "4"

  ComboBox1.ItemIndex := 4;

end;

 

如果不知道下标值,你也可以使用IndexOf方法来找到这个值,如下:

[delphi] view plaincopyprint?

1. procedure TForm27.FormCreate(Sender: TObject); 

2. begin 

3. ComboBox1.Items.Add('Alabama'); 

4. ComboBox1.Items.Add('Alaska'); 

5. ComboBox1.Items.Add('Arizona'); 

6. ComboBox1.Items.Add('Arkansas'); 

7. ComboBox1.Items.Add('California'); 

8. // Other states can be listed here 

9. 

10. ComboBox1.ItemIndex := ComboBox1.Items.IndexOf('California'); 

11. end

12. 

13. 

14. 

15. 

procedure TForm27.FormCreate(Sender: TObject);

begin

  ComboBox1.Items.Add('Alabama');

  ComboBox1.Items.Add('Alaska');

  ComboBox1.Items.Add('Arizona');

  ComboBox1.Items.Add('Arkansas');

  ComboBox1.Items.Add('California');

  // Other states can be listed here

 

  ComboBox1.ItemIndex := ComboBox1.Items.IndexOf('California');

end;

 

 

实现用户选择的事件处理过程

在用户选择完某一项之后,OnChange事件会被触发,你可以为OnChange事件实现事件处理过程。

要实现OnChange的事件处理过程:

1. 选择TcomboBox组件。

2. 在Object Inspector中,打开Events页,然后双击OnClick事件旁边的空白处。

3. 然后会自动打开Code Editor,编写如下代码:

[delphi] view plaincopyprint?

1. 

2. procedure TForm27.CalendarEdit1Change(Sender: TObject); 

3. begin 

4. ShowMessage(Format('Item %s at Index %d was selected. '

5. [ComboBox1.Selected.Text, ComboBox1.ItemIndex])); 

6. end

7. 

8. 

 

procedure TForm27.CalendarEdit1Change(Sender: TObject);

begin

  ShowMessage(Format('Item %s at Index %d was selected. ',

    [ComboBox1.Selected.Text, ComboBox1.ItemIndex]));

end;

 

这个事件处理过程显示一个对话框来提示选中的项。

Format函数根据一个格式字符串以及参数数组来返回一个格式化的字符串。

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

 

  

iOS应用程序中使用WebBrowser组件

FireMonkey iOS应用程序中使用WebBrowser

iOS平台上,FireMonkey使用TWebBrowser组件来封装Web Browser。这篇文单讲述了如何在iOS上创建一个简单的FireMonkey浏览器程序。

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

第一步:设计界面

1. 选择File>New>FireMonkey Mobile Application – Delphi>BlankApplication

2. 在Tool Palette中选择TToolBar组件,然后拖到FireMonkey Mobile Form Designer上去。

要找到TToolBar,在ToolPalette的搜索框中输入开头的几个字母(tool):

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

3. 在你拖好控件之后,你就可以在Form Designer的顶部看到这个TComboBox组件了:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

4. 在Tool Palette中选择TButton组件,并拖放到ToolBar上面。

5. 在Mobile Form Designer上选中Button组件,然后在Object Inspector中的StyleLookup属性中选择priortoolbuttonbordered

Tbuttonpriortoolbuttonbordered这个StyleLookup值在iOS Style中会添加一个返回按钮标签:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

更多关于在FireMonkey iOS应用程序中选择Style的细节,请查看Delphi for iOS教程(4):iOS应用程序中使用不同风格的按钮组件

6. 在Tool Palette中选择TEdit组件并拖放到ToolBar上面。确保Edit控件的尺寸填充ToolBar的空余区域:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

7. 在Tool Palette中选择TWebBrowser组件并拖放到窗体上面。

8. 在Mobile Form Designer上选中WebBrowser组件,然后在Object Inspector中的Align属性设置为alClient

在完成这些步骤后,窗体看出来应该是如下图所示:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

第二步:编写一个事件处理过程,当用户更改URL文本框时打开一个网页

与桌面平台不一样的是,Mobile Device使用如下图所示的Virtual Keyboard来输入文字。用户可以通过点击DoneReturn来完成这个动作。

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

FireMonkey提供一些事件处理过程来处理用户操作的响应。在Done按钮按下的时候,FireMonkey框架发送一个OnChange事件给TEdit控件。另一方面,Return按钮没有相应的事件。在这节中,你实现事件处理过程来同时支持这两种情况。

实现打开网页的共用方法

在实现事件处理过程之前,首先实现一个打开网页的共用方法,使用Edit控件的Text属性。

1 在Code Editor中,创建下面代码:

[delphi] view plaincopyprint?

1. procedure OpenURL; next to{ Private declarations } 

procedure OpenURL; next to{ Private declarations }

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

2.按下CTRL+SHIFT+C来在文件的末尾创建一个占位符:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

3.按下面的代码片断来实现这个OpenURL方法:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

实现OnChange事件的事件处理过程

1 在Mobile FormDesigner中,选中Edit控件,然后在Object InspectorEvents页),双击OnChange事件旁边的空白区域来创建事件处理过程。

Object Inspector创建一个名为Edit1Change的事件处理过程:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

2.添加如下代码来实现这个事件处理过程:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

实现返回按钮的事件处理过程

为了给WebBrowser实现返回按钮,你可以简单的调用WebBrowser组件的GoBack方法:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

基本的功能已经实现了。尝试在iOS SimulatoriOS Device中运行你的应用程序。

第三步:为Web Browser应用程序选择合适的键盘

在运行你的第一个WebBrowser应用程序之后,你会发现虚拟键盘不是很合理。

iOS提供以下几种虚拟键盘:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

Edit控件的KeyboardType属性中选择vktURL做为合适的虚拟键盘:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

iOS应用程序中使用Tab组件来显示分页

FireMonkey iOS应用程序中的Tab

TabFMX.TabControl.TTabControl定义,它是一个容器,用来包含一些Tab页:

· 每个Tab页可以包含任意UI元素。 

· 你可以隐藏这些页,不用显示点按来切换Tab页。

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

对于每个Tab,你可以指定预先定义好的图片,也可以自定义图标,以及Text标签。

当然你也可以在控件的顶部或底部放置Tab

使用Form Designer设计Tab

要在应用程序中创建Tab页,按下面的步骤使用TTabControl组件:

1.创建一个HD FireMonkey Mobile Application,选择File>New>FireMonkeyMobile Application-Delphi>Blank Application。使用默认的iPhone目标平台(iOS Simulator)。

2.从Tool Palette中选择TTabControl

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

 

3.在你拖放TTabControl之后,一个空的TabControl会显示在FireMonkey MobileForm Designer

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

4.通常,应用程序使用TabControl的时候都是全屏显示页面的。你需要更改TTabControl的默认对齐方式,更改TabControlAlign属性为alClient

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客

5.右击TabControl,然后从弹出菜单中选择Items Editor…

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

6.点击三次Add Item,以便创建一个TabItem的实例。关闭对话框。

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

7.在FireMonkey Mobile FormDesigner上,选择第一个TabItem,并更改它的StyleLookup属性为tabitembookmarks

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

8.你可以在任意页面放置任何控件。为了移动到不同的页面,只需要在Form Designer上点击你想到的Tab,或在Object Inspector里改变ActiveTab属性:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 
 

9.为了改变Tab的位置,选择TabControl组件的TabPosition属性。每个Tab,你都可以在Object Inspector选择下列任意值:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

自定义Tab图标

你可以通过下面这些步骤来给Tab页使用自定义图标和自定义标题。

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

1.放置一个TabControl,设置它的对齐(Align属性),然后为它创建几个Tab页。

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

2.选择一个Tab,然后在Object Inspector中,点击TTabItemCustomIcon属性中的Bitmap字段的[…]省略号按钮:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

3.从下拉菜单中选择Edit…

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

4.在Bitmap Editor中,点击Load…按钮,选择一个PNG文件。普通方案建议尺寸为30*30,高级方案建议60*60(你在下一步用设置BitmapHiRes图标):

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

5.关闭Bitmap Editor,在Object Inspector中选中你想要使用的CustomIconBitmapHiResHigh-Resolution)字段。

6.在Object Inspector中将StyleLookup属性设置为tabitemcustom

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

7.在Text属性里,更改Tab上的Text

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

在本篇教程中所使用的自定义图片都放在你的$(BDS)\Images\GlyFX目录下。

在你定义好一个图标之后,FireMonkey框架根据给定的.png文件生成一个选中的图片和一个未选中的图片。这个转换由Bitmap DataAlpha-Channel完成。例如:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
   

TabControl中放置控件

刚才讲过,每个Tab页可以包含任何数量的控件,包括另一个TabControl。在这种情况下,你可以在Structure View中方便的查看并管理不同的Tab页。

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

在运行时切换分页

通过用户点按Tab

如果Tab显示(当TabPosition设置成不是tpNone),用户可以简单的点按Tab来在分页之间进行切换。

通过ActionActionList

Action绑定一个或多个用户界面元素,例如菜单项,工具条按钮,控件等。Action提供两个功能:

· Action提供用户界面元素的通用属性,例如控件是否可用或勾选框是否选中。 

· Action响应控件触发,例如,当应用程序用户点击按钮或选中了菜单项。

这里是让用户通过点击按钮来移动到不同分页的实现步骤:

1.在FireMonkey Mobile应用程序中,放置一个TabControl,在上面放置一些Tab项(TabItem1TabItem2TabItem3)。

2.从Tool Palette中,添加一个TButton到窗体上,然后添加一个ActionList组件:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
  

3.在Object Inspector中选择Button组件,然后从下拉菜单中选择Action|New StandardAction|Tab>TChangeTabAction。在用户点击这个按钮时,你刚才定义的Action就会被执行(Tab分页会切换):

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

4.在Structure View中选择ChangeTabAction1,然后在Object Inspector中选择TabItem2作为Tab属性的值,这个Action就可以将当前分页切换到TabItem2:

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

6ChangeTabAction也支持Slide动态效果来表现分页之间的切换。为了使用它,设置Transition属性为ttSlide

Delphi iOS应用程序开发(2) - 鑫淼梦园 - 鑫淼梦园的博客
 

通过写代码

你可以使用下面几种方法来在代码中切换当前的分页:

· TTabItem的实例赋给ActiveTab属性:

[delphi] view plaincopyprint?

1. TabControl1.ActiveTab := TabItem1; 

TabControl1.ActiveTab := TabItem1;

· 更改TabIndex的值。TabIndex属性是0开始的下标值(你可以使用0TabControl1.TabCount-1之间的值)。

[delphi] view plaincopyprint?

1. TabControl1.TabIndex := 1

  TabControl1.TabIndex := 1;

· 如果定义了ChangeTabAction,你也可以从代码里执行这个Action

[delphi] view plaincopyprint?

1. // You can set the target at run time if itis not defined yet. 

2. 

3. ChangeTabAction1.Tab := TabItem2; 

4. 

5. 

6. 

7. // Call the action 

8. 

9. ChangeTabAction1.Execute; 

  // You can set the target at run time if itis not defined yet.

  ChangeTabAction1.Tab := TabItem2;

 

  // Call the action

  ChangeTabAction1.Execute;

 

  评论这张
 
阅读(2224)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017