博客园客户端UAP开发随笔 -- 让你自己和你的App有国际范儿

大家是不是发现,在商店中看到的高大上的应用都有着多语言支持,可以根据操作系统的语言自动适配;或者可以通过用户的选择,显示对应的语言界面,确实很高大上呢。不过这个可不是什么难事,通过简单的几个步骤,让你的应用也高大上起来,支持多语言。这样在你以后的简历里,也可以写上:面向国际市场开发过多语言应用。听上去相当有底气!

0. 准备工作

在建立多语言支持前,首先要看一下 Manifest 文件中的默认语言选项,将它设置为你希望的默认显示语言。

接下来建立存放语言字符串的文件夹。如果是Universal App,就如下图所示,在 Shared 文件夹下建立 Strings 子文件夹,并在其中根据自己 App 希望支持的语言,再建立子文件夹,子文件夹的名称要和语言的编码一致。关于具体语言的编码,可以查询 Language Codes 页面:

http://msdn.microsoft.com/en-us/library/ms533052%28v=vs.85%29.aspx

如果不是 Universal App,那么 Strings 文件夹应该放在项目的根目录下。

建立好文件夹以后,在每个文件夹中添加 "Resources File (.resw)"。微软推荐使用默认文件名,以便在项目中进行调用。如果有特殊命名需求,请参考 How to load string resources (XAML) 页面:

http://msdn.microsoft.com/en-us/library/windows/apps/xaml/hh965323.aspx

这些做完以后,多语言支持的框架就算是搭起来了,剩下的就是往里填写内容了。

1. 填写字符串

以 en-US 举例,我们打开 en-US 的 Resources.resw 文件,会发现其中分为三列,分别是 Name,Value 和 Comment。顾名思义,分别是字符串引用的名称,字符串的内容和字符串的备注或评论。那么我们就开始根据自己的需求填写字符串。其中 Name 和 Value 较为重要,必须填写,Comment 主要是增强可读性,不是必填项。

如果是需要对界面,也就是 XAML 语言定义的部分进行多语言支持,那么 Name 的部分就要像 XAML 语言定义一样,针对控件的每个单元进行定义。例如:

需要对文本框的内容,也就是 Text 进行多语言支持,那么 Name 部分就必须是 NameofTextbox.Text 的格式。比如下图中,我们要对“精华栏标题”进行多语言支持,那么我们首先为精华栏标题命名为 BestTitle,并且针对 BestTitle.Text 这一 Name 填写内容 Best。那么这一工作就做完了。

对于Button控件来说,其文本部分叫做Label(为什么就不能统一叫Text呢?好奇怪啊),所以要给AppButton_Zoom这个button填写一个AppButton_Zoom.Label项。

2. 界面引用字符串

有了这个命名,我们如何在界面中进行调用呢?

很简单,通过 Uid 实现。

找到 XAML 中对应的部分,添加 x:Uid="BestTitle" 这一属性,这样系统就会自动在多语言支持中找到对应的内容,并将 Text 的内容对应赋予该 TextBlock 的 Text 属性。这样,我们就无需在 XAML 文件中将现实的内容硬编码进去,只需要修改对应的资源文件就可以,是不是很方便呢。

<Button Style="{StaticResource Win8TopAppBarButton}" Tag="CNBlogs.Pages.BestPostsPage" Click="NavButton_Click" Padding="30">
                <Button.Content>
                    <TextBlock>
                    <Run Text="" FontFamily="Segoe UI Symbol"/>
                    <Run x:Uid="BestTitle" Text=""/>
                    </TextBlock>
                </Button.Content>
            </Button>

运行一下看看效果,如果系统语言默认是英文的话,那么显示的内容就已经如我们所愿,变成英文的了。如果不是英文也没有关系,我们可以通过切换系统语言,或者在程序中设置应用语言来实现这一点,设置语言的方法,会在后文讲述。

对应的,我们也要添加上中文的内容,这样才能保证两种语言的对应性。

眼尖的读者一定发现了,不光 Text,连 FontSize 也可以定义么?对的,对于 Width,字体等简单属性,我们都可以根据不同语言的特性,对控件进行根据语言分类的设定,这样才可以使界面更加符合不同语言的特性及使用习惯。

3. 后台代码引用字符串

虽然前台设计主要由 XAML 实现,但是还是会有部分漏网的字符,是在后台的 C# 代码中实现的。对于这些部分的显示,如何调用资源文件中的内容呢?答案也是非常简单的。

首先,在资源文件中定义要调用的字符串。值得注意的是,这里不能像定义 XAML 中使用的字符串一样,使用类似 NameofTextbox.Text 的格式,而是要使用类似于变量命名的命名规则,不能再用”.”等分隔符隔开。否则系统调用会失败。

填写完成以后,我们打开后台 C# 代码,首先添加这一句:

Windows.ApplicationModel.Resources.ResourceLoader loader = new Windows.ApplicationModel.Resources.ResourceLoader();

这样就定义了一个 loader,由他负责从资源文件中找寻对应的语句。

当我们需要字符串的时候,就将字符串的部分替换为 loader.GetString("STRING_NAME")即可,其中 STRING_NAME对应的就是在资源文件中定义的 Name。例如,我们需要调用 "CommentTextblockText_Status1" 和 "CommentTextblockText_Status2" 字符串,那么我们就使用语句:

CommentButton.Content = isCommentTemperarorilyShown ? loader.GetString("CommentTextblockText_Status2") : loader.GetString("CommentTextblockText_Status1");

就可以了。

4. 设置程序语言

如果在 Windows Store App 中希望无视系统语言,强制设置程序语言,也是可以的。我们只需要在页面中添加一句:

Windows.Globalization.ApplicationLanguages.PrimaryLanguageOverride = "zh-CN";

就可以了。不过需要注意,这一句代码执行完了以后,只会对之后打开的页面生效,之前加载的页面的语言并不会发生变化。若希望全局生效,最好的办法是重新启动一下应用程序。

一个更好的办法是建立一个如图的下拉菜单:

这样可以方便用户自己选择界面语言。

遗憾的是,在 Windows Phone 中并没有这么好的全局设定方案,界面语言只能跟随系统显示语言。如果想要重设界面语言,就只能使用另外的黑科技了。

5. 其他

在中文和英文资源文件之间来回切换是个很痛苦的事情,尤其是界面字符串数目比较多的时候。笔者推荐一个插件,可以比较方便的进行语言之间的比较和翻译。

在 Visual Studio 中选择 TOOLS – Extensions and Updates,搜索 ResXManager 这一插件,安装重启以后,在 TOOLS 菜单中就可以打开它,界面如下图所示:

这样的对照界面比原来单一语言界面方便多了,如果有某种语言条目的空缺,他还会标红提醒,实在是多语言及本地化支持的利器。

小结

本地化及多语言支持的技术并无难点,困难之处往往在于多语言特点的兼顾,翻译的准确性及维护上。本文只是万里长征的第一步,后面的路还要开发者们一个字符串一个字符串去铺成……

分享代码,改变世界!

Windows Phone Store App link:

http://www.windowsphone.com/zh-cn/store/app/博客园-uap/500f08f0-5be8-4723-aff9-a397beee52fc

Windows Store App link:

http://apps.microsoft.com/windows/zh-cn/app/c76b99a0-9abd-4a4e-86f0-b29bfcc51059

GitHub open source link:

https://github.com/MS-UAP/cnblogs-UAP

MSDN Sample Code:

https://code.msdn.microsoft.com/CNBlogs-Client-Universal-477943ab

时间: 2024-10-07 06:06:13

博客园客户端UAP开发随笔 -- 让你自己和你的App有国际范儿的相关文章

博客园客户端UAP开发随笔 – 让自己的App连接世界(2):WinRT中的内置分享

看到一篇眼前一亮的博文,是不是有一种希望其他小伙伴都能看到的感觉呢?有没有一种“不转不是程序员”的冲动呢?在 PC 浏览器上看到还好办,直接网址复制,另一边 IM 上就发过去了,但是如果是 App 中的内容,就没这么方便了,总不能那边 IM 上喊话:“隔壁老王,博客园上有篇叫‘博客园客户端(Universal App)开发随笔 – 为应用插上分享的翅膀’的博文超好看,要不你也瞅瞅?”.隔壁老王再去搜索就太麻烦了.可能你会说了,嗨,直接分享不就完了么.嗯,没错,就是分享功能.那么如何把分享功能引入

博客园客户端UAP开发随笔 -- 搭建App之间的桥梁

开发Windows Phone应用的同学们应该都注意到了,Windows Phone 为了安全性,对应用的限制还是比较多的.我记得一位360的同学很无奈的说:WP太安全了,我们这些做WP上360卫士的基本上没啥可做的.但是当WP360那个App出来后,还是有很多用户安装了呢,尽管真的对安全没什么太大的帮助,但是对用户了解自己的手机的使用情况还是有帮助的.其中一位用户的评价是:从android到PC,我一直用360, 所以在WP上我也用.呵呵,粉丝啊!具体有什么用其实他也不关心铁粉而已. 扯远了!

博客园客户端UAP开发随笔 -- App的心动杀手锏:动画

前言 在前面一篇“新年快乐”的随笔中,我们介绍了WinRT中的简单动画实现.其实在使用Windows/Windows Phone时,我们都会看到一些动画,最简单的比如按下一个button时,该button的状态变化就是动画的一种.再比如弹出式窗口或菜单,也是一种动画.WinRT中的动画种类很多,但是分类有点儿让初学者摸不着头脑:主题过渡,主题动画,视觉转换,情节提要动画.这些我们就不说了,这里主要说说自定义动画,或者说是情节提要动画(Storyboard Animation),因为这种动画是我们

博客园客户端UAP开发随笔 -- 奔跑吧,页面!

前言 页面导航,是App中的基本功,一般的App,一来一去,只需要简单的Navigate + Back就行了,一个复杂的App可能需要很多导航模式的混合才能实现最佳用户体验. SplashScreen 启动屏幕 我们先从最开始的SplashScreen说起吧.如果你把启动屏幕做成一个Page,启动时先显示一下,然后假装忙乎两秒,跳到下一个主页面开始进入正题,这个好像看上去也很美好.但是当用户玩命儿按Back键时,哦,露出马脚了,启动页面被唤出了.不过这个bug倒是不妨作为一个新奇的体验. MSD

博客园客户端UAP开发随笔 -- App连接云端内容的桥梁:WebView

当你辛苦的从网上爬下来一篇文章之后,怎么在你的应用内展示这些包含HTML标记的文章?如果你使用的是Javascript开发应用,恭喜你,直接塞进页面就可以了,同时说明你很熟悉页面开发,而现在windows也支持这种方式.但是对于使用XAML开发的应用怎么办呢?我们还有WebView控件可以用. 越来越多的服务器端API返回的数据使用HTML了,所以我们也不得不对WebView多了解一些. WebView有个Bug:放在Grid里时,最右侧有一个pixel缝隙时隐时现.要小心,别让PM抓住你的小辫

博客园客户端UAP开发随笔--自定义控件的左膀右臂

前言 我们上一次说到了App的精灵:自定义控件.这一次,我们接着这一话题,说说自定义控件的两个得力助手: 选择器 - TemplateSelector 转换器 – Converter 这两个东西能帮助自定义控件更为简单方便地被使用,所以必须掌握. 数值转换器 Converter 这个大家可能不陌生,因为在MSDN里,介绍到Data Binding时,总会顺带着介绍一下数据转换,比如这个网页: http://msdn.microsoft.com/library/windows/apps/xaml/

博客园客户端UAP开发随笔 -- App UI设计的三大纪律八项注意

前言 每一个页面都是这个App的门面,尤其是主页面,看上去干净整洁清爽宜人容易操作,那么你的App就成功了一半.这也反映出了你这个开发团队的基本审美素质和设计理念.如果你不是一个团队,而是一个个人开发者,建议你好好读读以下心得体会,相信会帮助你做出好看而实用的App.用一堆拥有丑陋UI的App充斥Window Store,不是我们高大上的程序员所为,被其他手机开发平台的开发者们耻笑. 三大纪律: 1)不乱用颜色.一个页面内不要超过3种颜色 2)不乱用大图片当背景.你是想让用户看你的背景图片呢,还

博客园客户端UAP开发随笔 -- 狡兔三窟:App内的三种通知消息的实现

使用应用时,总会有各种各样的交互,其中有些是需要和用户交互的,有些是仅仅告知用户某些信息的.对于前者,通常的解决方案都是弹出一个带有按钮(或其他控件)的对话框,上面有需要用户知晓的信息,以及需要用户通过按钮(或其他控件)做出的响应交互,这里就不再介绍.对于后者,那些不需要用户做出交互,仅仅是告知用户信息的,实现方式大家各有不同,本文将提出几种解决思路,抛砖引玉,希望通过交流,得到更好的人机交互解决方案. 1. 弹出窗口提示 这个方法比较简单粗暴,直接调用了系统的 MessageDialog 方法

博客园客户端UAP开发随笔 -- 让自己的App连接世界:WinRT中的微博分享

近年来社交app可谓红红火火,大家每天发微博,分享到朋友圈也是不亦乐乎.我们的Universal应用自然也希望加入社交分享的功能.然而国内主流的社交平台微博和微信还没有推出适用于Universal应用的SDK,怎么办呢?当然敲碗等开饭也是办法,另一方面我们也可以自己做一些努力.今天我们就想分享一下我们在Universal应用中实现分享到微博功能上的探索. 准备 想要分享到微博,先得注册成为微博开发者.我们在http://open.weibo.com/上注册好开发者账号,建立个测试应用,就可以拿到