Flex 国际化(flex Localize)

分类：Flex作者：编程之家用户

项目中用到flex国际化，虽然以前也用过，也是直接嵌入到程序中，现在有要求要放到外面模块中去，虽然网上教程多多，但是遇到还是遇到很多问题，籍此写下此文，加深印象之用。如果有哪位仁兄只好也用到此，希望能有所帮助，废话至此，正文开始。

先说说编译到主程序中去的方法吧。

1.创建资源文件夹

譬如可以在src文件夹下创建Locale文件夹，然后在此文件夹再次创建每个地区的资源文件夹，譬如de_DE,zh_CN.

然后分别创建后缀名为.properties的资源文件，分别放到各个地区的文件夹中。资源文件是可以包括任何事情，从字符串，数字，格式化和图片到样式。每个地区可以生成一个单独的文件。参考：CreateLocaleFiles.png

2.创建资源文件

创建了名为resources.properties的资源文件，内容为：

 

## resources.properties file for locale de_DE ## 

# contact-form labels and assets 
contact.title=Contact Form 
contact.flagImg=assets/us.gif 
contact.submit=Submit 

# contact-form fields 
contact.field.name=Name 
contact.field.streetAddress=Street Address 
contact.field.city=City 
contact.field.state=State 
contact.field.zipCode=ZIP Code 
contact.field.country=Country

 

3.创建mxml文件

 

<?xml version="1.0" encoding="utf-8"?>
<s:VGroup xmlns:fx="http://ns.adobe.com/mxml/2009" 
		  xmlns:s="library://ns.adobe.com/flex/spark" 
		  xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%">
	<fx:Metadata>
		[ResourceBundle("resources")]
	</fx:Metadata>
	<fx:Script>
		<![CDATA[
			private var locales:Array = [{label:"English (United States)",locale:"en_US"},{label:"中文 (中国)",locale:"zh_CN"},{label:"German (Denmark)",locale:"de_DE"},{label:"French (France)",locale:"fr_FR"},{label:"Japanese (Japan)",locale:"ja_JP"}];
			
			private function comboChangeHandler():void
			{
				resourceManager.localeChain = [localeComboBox.selectedItem.locale];
			}
		]]>
	</fx:Script>
	
	<s:Panel title="{resourceManager.getString('resources','contact.title')}" color="black" borderAlpha="0.15" width="350">
		<s:layout>
			<s:VerticalLayout horizontalAlign="center" paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10" />
		</s:layout>
		
		<mx:Form width="100%" color="0x323232">
			<mx:FormItem label="{resourceManager.getString('resources','contact.field.name')}">
				<s:TextInput />
			</mx:FormItem>
			<mx:FormItem label="{resourceManager.getString('resources','contact.field.streetAddress')}">
				<s:TextInput />
			</mx:FormItem>
			<mx:FormItem label="{resourceManager.getString('resources','contact.field.city')}">
				<s:TextInput />
			</mx:FormItem>
			<mx:FormItem label="{resourceManager.getString('resources','contact.field.state')}">
				<s:TextInput />
			</mx:FormItem>
			<mx:FormItem label="{resourceManager.getString('resources','contact.field.zipCode')}">
				<s:TextInput />
			</mx:FormItem>
			<mx:FormItem label="{resourceManager.getString('resources','contact.field.country')}">
				<s:TextInput />
			</mx:FormItem>
			<mx:FormItem>
				<s:Button label="{resourceManager.getString('resources','contact.submit')}" />
			</mx:FormItem>
		</mx:Form>
	</s:Panel>
	<mx:Spacer height="15" />
	
	<s:HGroup width="350" verticalAlign="middle">
		<mx:Spacer width="100%" />
		<mx:Image source="{resourceManager.getString('resources','contact.flagImg')}"/>
		<mx:ComboBox id="localeComboBox" dataProvider="{locales}" change="comboChangeHandler()"/>
	</s:HGroup>
</s:VGroup>

 

 4.配置Flex 编译参数

选中项目名称右键-Properties-Flex Complier-Addtional compiler arguments中添加

 

-locale=en_US,zh_CN -allow-source-path-overlap=true -source-path=Locale/{locale}

 这样就可以了，你可以通过切换发现可以实现国际化了，哈哈，不过只有两种地区的简单demo。

 

再谈谈用module分别加载不同地区资源

 

到底怎样加载这些资源文件决定于你的程序许多支持多少地区本地化。

a.如果你仅仅只是支持一到两个地区的本地化，那么一般来说就是直接编译到程序中。

b.如果要支持很多种本地化，一般选择在运行时加载所需的本地化资源。资源模块和编译入主程序相比，资源模块是一种比较好的本地化方式，因为它指定的资源模块可以在运行时加载。这样可以减小主程序的文件大小，但是如你所见你必须为每个资源模块加载一个单独的swf文件。这样的话会增加网络请求并且合成的主程序的大小比直接编译入主程序的方式更大。尽管如此，如果你有很多本地化的需求，分别单独的加载它们从长远来看会节省资源。

1.2 和上面一样

3.建立mxml文件

 

<?xml version="1.0" encoding="utf-8"?>
<s:VGroup xmlns:fx="http://ns.adobe.com/mxml/2009" 
		  xmlns:s="library://ns.adobe.com/flex/spark" 
		  xmlns:mx="library://ns.adobe.com/flex/mx" 
		  width="100%" 
		  height="100%" 
		  creationComplete="initApp()">
	<fx:Script>
		<![CDATA[
		import mx.controls.Alert;
		import mx.events.ResourceEvent;
		import mx.resources.ResourceBundle;
		
		[Bindable]
		private var locales:Array = [ "zh_CN","de_DE" ];
		
		private function initApp():void {
			/* Set the index to -1 so that the prompt appears 
			when the application first loads. */
			localeComboBox.selectedIndex = -1;            
		}
		
		private function registrationComplete():void {
			Alert.show(resourceManager.getString('resources','thanks'));
		}  
		
		private function comboChangeHandler():void {
			var newLocale:String = String(localeComboBox.selectedItem);
			
			/* Ensure that you are not loading the same resource module more than once. */
			if (resourceManager.getLocales().indexOf(newLocale) != -1) {
				completeHandler(null);
			} else {
				// Build the file name of the resource module.
				var resourceModuleURL:String = newLocale + "_ResourceModule.swf";
				
				var eventDispatcher:IEventDispatcher = 
					resourceManager.loadResourceModule(resourceModuleURL);
				eventDispatcher.addEventListener(ResourceEvent.COMPLETE,completeHandler);
			}            
		}
		
		private function completeHandler(event:ResourceEvent):void {
			resourceManager.localeChain = [ localeComboBox.selectedItem ];
			
			/* This style is not bound to the resource bundle,so it must be reset when 
			the new locale is selected. */
			var test:String = resourceManager.getString('resources','contact.field.city');
			b1.setStyle("downSkin",resourceManager.getClass("RegistrationForm","flag"));            
		}        
	]]></fx:Script>
	<s:Image source="{resourceManager.getClass('resources','flag')}"/>
	<mx:ComboBox id="localeComboBox" 
				 prompt="Select One..."
				 dataProvider="{locales}"
				 change="comboChangeHandler()"/>
	<mx:Form width="100%" color="0x323232">
		<mx:FormItem label="{resourceManager.getString('resources','contact.field.name')}">
			<s:TextInput />
		</mx:FormItem>
		<mx:FormItem label="{resourceManager.getString('resources','contact.field.streetAddress')}">
			<s:TextInput />
		</mx:FormItem>
		<mx:FormItem label="{resourceManager.getString('resources','contact.field.city')}">
			<s:TextInput />
		</mx:FormItem>
		<mx:FormItem label="{resourceManager.getString('resources','contact.field.state')}">
			<s:TextInput />
		</mx:FormItem>
		<mx:FormItem label="{resourceManager.getString('resources','contact.field.zipCode')}">
			<s:TextInput />
		</mx:FormItem>
		<!--<mx:FormItem label="@Resource(key='contact.field.zipCode',bundle='resources')">
			<s:TextInput />
		</mx:FormItem>-->
		<mx:FormItem>
			<s:Button label="{resourceManager.getString('resources','contact.submit')}" />
		</mx:FormItem>
	</mx:Form>
	
	<s:Button id="b1" 
			  label="{resourceManager.getString('resources','submit_button')}" 
			  click="registrationComplete()"/>
</s:VGroup>
 

4.确定需要哪些资源束

在你编译资源模块之前，你必须知道那些资源束应该放到它里面。换句话说，你必须要知道那些资源是你的主程序-包括它的框架-真正需要的。这不仅仅包括你所创建程序需要的的资源，而且也包括程序框架需要的资源。

在你的flex bulider中找到mxmlc.exe 文件，例如我的在：C:\Program Files\Adobe\Adobe Flash Builder 4.6\sdks\4.6.0\bin，执行

 

mxmlc -locale= -resource-bundle-list=myresources.txt F:\demo\Demo\src\view\resource\ResourceMoudleDemo.mxml

 

当你使用resource-bundle-list选项时，你还必须设置locale的值为空。

myresource.txt 就是待会要把你所有要国际化的页面和框架所需的所有文件名输出到这个文件中，地址就在mxmlc.exe文件的同一目录

F:\demo\Demo\src\view\resource\ResourceMoudleDemo.mxml 就是你要国际化的页面的绝对路径

执行完后到myresource.txt中查看，内容为：

 

bundles = collections components containers controls core effects layout resources skins styles textLayout

 其中的resources就是自定义的资源文件，其他就是框架所用的文件了

5.把所有的文件都编译到一个swf中

 

mxmlc -locale=de_DE
-source-path=F:\demo\Demo\src\Locale\{locale} -include-resource-bundles=resources,collections,components,containers,controls,core,effects,layout,skins,styles,textLayout -output de_DE_ResourceModule.swf

 这个时候就会在mxmlc.exe中相同的目录中生成de_DE_ResourceModule.swf。

然后你再改变下-locale=zh_CN,生成zh_CN_ResourceModule.swf。

然后把这两个swf放到主程序相同目录下，测试加载即可。

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

相关推荐

css display:flex 属性
一：display:flex布局display:flex是一种布局方式。它即可以应用于容器中，也可以应用于行内元素。是W3C提出的一种新的方案，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持。Flex是FlexibleBox的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵
display:flex 布局详解2
1. flex设置元素垂直居中对齐在之前的一篇文章中记载过如何垂直居中对齐，方法有很多，但是在学习了flex布局之后，垂直居中更加容易实现HTML代码：1<divclass="demo">2<divclass="inner">3<p>这是一个测试这是一个测试这是一个测试这是一个测试这是一个测试</p>4</div
移动端开发
移动端开发知识点pc端软件和移动端apppc端软件是什么，有哪些应用。常见的例子，比如360杀毒，photoShop，VisualStudioCode等等移动端app是什么，有哪些应用。常见的例子，比如手机微信，手机qq，手机浏览器，美颜相机等等PC端与移动端的区别第一：PC考虑的是浏览器的兼容性，移动端考
grid布局笔记
最近挺忙的，准备考试，还有其他的事，没时间研究东西，快周末了，难得学点东西，grid是之前看到的，很好奇，讲的二维的布局，看起来很方便，应该很适合移动端布局，所以今天抽时间学一学，这个当是笔记了。参考的是阮老师的博客。阮一峰：CSSGrid网格布局教程http://www.ruanyifeng.com/blog/2019/03/g
盒模型
display:flex;把容器设置为弹性盒模型（设置为弹性盒模型之后，浮动，定位将不会有效果）给父元素设置的属性：（1）display：flex---把容器设置为弹性盒模型。（2）flex-direction---设置弹性盒模型主轴方向默认情况下主
javascript – Flex禁用Safari键盘快捷键
我在网页上运行了一个Flex应用程序,我想使用Command←组合键在应用程序中触发某些操作.这在大多数浏览器上都很好,但在Safari上,浏览器拦截此键盘事件并导致浏览器“返回”事件.有没有办法,通过Flex或通过页面上的其他地方的JavaScript,我可以告诉Safari不要这样做？解决方法:简短的
flex布局，flex-item
flex布局，flex-item1<template>2<viewclass="container">3<viewclass="greentxt">4A5</view>6<viewclass="redtxt">7B8<
c# – 大屏幕多点触控交互式应用程序设计
我应该设计一个大型多点触控屏幕的应用程序.从大到大,我的意思是新闻广播员(大约55英寸及以上).该应用程序是一个交互式地图.我的问题是：开发应用程序的技术.我的第一个想法是在AdobeFlex中制作,但是HTML5也是如此……必须有一些非常棒的Java库用于触摸交互,但是在Windows平台上
左图有文字的一些CSS样式
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><metahttp-equiv="X-UA-Compatible&quo
弹性盒模型：flex多行多列两端对齐，列不满左对齐
【1】需求：  【2】解决方案：最近遇到布局上要求item两端对齐，且最后一行在列不满的情况下要求左对齐，使用flex的justify-content:space-between;实现时发现最后一行不能左对齐，而是两端对齐方式。 不是项目上想要的效果#网上查了一些资料，有两种方法可以实现效果：**1.
AS3无法从Java发送的套接字解​​码AMF3对象
我有一个java套接字服务器,它在连接时将Animal对象发送到Flash客户端.对象发送方式如下：Amf3Outputamf3Output=newAmf3Output(SerializationContext.getSerializationContext());amf3Output.setOutputStream(userSocket.getOutputStream());amf3Output.writeObject(animal)
java – 在JBoss上使用Flex / BlazeDS的Client.Error.MessageSend问题
我正在开发一个Flex3.4应用程序,它通过最新版本的BlazeDS与JBoss-4.2.2服务器上运行的JavaEE后端进行交互.当我在Tomcat上从FlashBuilder4beta2运行Flex应用程序时,一切都很好,Flex应用程序能够进行所需的远程调用.但我的生产环境是在JBoss上,当我将应用程序移动到JBoss时(更
java – NetConnection.Call.Failed偶尔在Flex3 / Tomcat / BlazeDS / Spring中发生
我有一个非常大的问题.我使用Flex3/Tomcat/BlazeDS/Spring编写了一个大型应用程序,在本地开发时运行良好,当我部署到公共开发环境时很好,但是当部署到我们的测试环境时经常失败.当远程处理请求花费大量时间(超过20秒)时,故障似乎最常发生.在我的开发服务器上,错误发生,但仅
HTML5的Day1
弹性和布局display:flex在ie6,ie7不兼容状态，一般在pc用的比较少,在手机端所有的浏览器都是支持的控制子元素在父元素里面的位置关系display:flex是给父元素加的文档流是按照主轴排列，只要父元素加了flex,那么里面的子元素全部可以直接添加宽高主轴的方向
FLEX源码分析
FLEX2.0源码分析（一）https://www.jianshu.com/p/8bc4c5f4b19fFLEX源码分析二（网络监测swizzle）https://www.jianshu.com/p/ffb95f2cbda6FLEX源码分析三（网络监测记录FLEXNetworkRecorder）https://www.jianshu.com/p/66267dc922c5FLEX源码分析四（Systemlog）https://www.jianshu.
页面伸缩布局实例
1<!DOCTYPEhtml>2<htmllang="en">3<head>4<metacharset="UTF-8">5<title><itle>6<style>7*{8margin:0;9padding:0;10
弹性盒子圣杯布局
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><metahttp-equiv="X-UA-Compatible&qu
flex与inline-flex
flex：将对象作为弹性伸缩盒显示inline-flex：将对象作为内联块级弹性伸缩盒显示两者都是使子元素们弹性布局，但是如果是flex，父元素的尺寸不由子元素尺寸动态调整，不设置时默认是100%，而inline-flex则会使父元素尺寸跟随子元素们的尺寸动态调整。
css实现手机端导航栏左右滑动
<html><head><metacharset="utf-8"><metaname="viewport"content="width=device-width"><title>test<itle><stylemedia="screen">.tab-head{list-style-type:no
php – 查找位于指定距离之间的用户(使用用户的邮政编码)
有没有办法使用邮政编码找到径向距离？我的任务是搜索居住在指定距离内的所有用户.我知道用户的zipcodes.例如,距离当前位置25英里的用户.我有其他搜索类别,我正在使用mysql查询.我无法解决距离问题.我的后端是在PHP中Flex的前端和前端.对我来说最好的选择就是www.zip-codes.com
pythonJavaScriptjavaHTMLPHPreactjsC#AndroidCSSNode.jssqlrpython-3.xMysqLjQueryc++pandasFlutterangularIOSdjangolinuxswifttypescript路由器JSON路由器设置无线路由器h3c华三华三路由器设置华三路由器电脑软件教程arraysdocker软件图文教程Cvue.jslaravelspring-boot