×
Namespaces

Variants
Actions

在Qt 和WP7上进行数据绑定

From Nokia Developer Wiki
Jump to: navigation, search
WP Metro Icon Porting.png
SignpostIcon WP7 70px.png
Article Metadata

代码示例
兼容于
文章
翻译:
最后由 hamishwillee 在 16 Jul 2013 编辑


Contents

在Qt 和WP7上进行数据绑定

这篇文章展示了在Qt 和WP7上如何进行数据绑定。

简介

数据绑定提供了一个简单的方式来显示数据并对数据进行操作。这种在用户界面和数据对象之间的绑定允许数据在它们之间流动。当用户触发某件事时,绑定到数据的用户界面元素将自动对变化做出反应。数据绑定就是一个连接器,它从数据源中获得数据并将它赋予元素的属性。如下图所示,绑定作用在数据和元素之间。

Data Binding Diagram
Qt Windows Phone
Data Binding in Qt
Data Binding in WP7
Example of Qt Example of WP

基本理念

在这种情况下我们将要创建一个TextBox,当用户编辑TextBox中的值时,在下面的数据值将根据改变自动更新。

实现

我们将在Qt上创建一个数据绑定样本项目并在WP7创建一个相同的项目。首先让我们在Qt 和 WP7上创建一个空白的项目。

Qt Project (main.qml)

让我们创建一个TextField来输入文本。

TextField {
id: myTextField;
y:160
width: parent.width -80
text: "Enter Text Here"
errorHighlight: true
anchors.horizontalCenter: parent.horizontalCenter
}

我们将TextField的文本属性绑定到Text元素。

Binding { target: text; property: "text"; value: myTextField.text }

用户在TextField里做的改变将由Text元素来显示。

Text {
id:text
text: qsTr("Hello World")
// anchors.centerIn: parent
font.pixelSize: 25
font.bold: true
y:330
x:50
color: "green"
}

WP7 Project (MainPage.xaml)

就像在Qt中一样,我们也在WP7创建一个TextBox,在这里用户能够输入文本。

<TextBox Height="72" HorizontalAlignment="Left" Margin="35,191,0,0" Name="textBox1" Text="TextBox" VerticalAlignment="Top" Width="381" />

为了显示文本我们添加一个TextBlock,在这个TextBox中,文本数据用文本框改变的属性值绑定。

<TextBlock Foreground="Green" FontStyle="Italic" FontFamily="Times New Roman" FontSize="35" Height="63" HorizontalAlignment="Left" Margin="50,367,0,0" Name="textBlock1" Text="{Binding Text, ElementName=textBox1}" VerticalAlignment="Top" Width="350" />

源代码

在Qt上完整的源代码可在如下网站获得:File:BindingQt.zip

在WP7上完整的源代码可在如下网站获得:File:BindingWP7.zip

This page was last modified on 16 July 2013, at 01:34.
86 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×