Cairngorm的结构及开发使用(3)(转)

本文介绍如何在SideArea.mxml中通过TabNavigator组件整合原始购物车与需求列表(心愿单),并实现从商品详情页面向这两个列表添加商品的功能。

将需求列表加入到视图

我将替换屏幕的一部分,只用包含两个ShoppingCart MXML组件的Tab Navigator显示ShoppingCart MXML组件。第一个实例是我们原始的ShoppingCart,而 第二个则是需求列表。

当用户发出添加产品到需求列表的动作时,你将改变ProductDetails组件来截获,就像添加产品到ShoppingCart一样。这就需要ProductDetails MXML组件要有一个addProductToWishList事件,下面是代码:

这个简单的需求,只要改动一下SideArea.mxml,如下:

<details:ProductDetails 

        id="productDetailsComp" 

        width="100%" height="325" 

        currencyFormatter="{ ModelLocator.currencyFormatter }" 

        selectedItem="{ ModelLocator.selectedItem }"           

        addProduct="addProductToShoppingCart( event )" 

        addProductToWishList="addProductToWishList( event )" />                   

 

<mx:TabNavigator width="100%" height="100%">

 

<!-- the Shopping Cart -->         

<cart:ShoppingCart 

        id="shoppingCartComp" 

        label="Shopping Cart" 

        width="100%" height="100%" 

        shoppingCart="{ ModelLocator.shoppingCart }" 

        selectedItem="{ ModelLocator.selectedItem }" 

        select="ModelLocator.selectedItem = event.target.selectedItem" 

        currencyFormatter="{ ModelLocator.currencyFormatter }" 

        addProduct="addProductToShoppingCart( event );" 

        deleteProduct="deleteProductFromShoppingCart( event );" 

        gotoCheckout="ModelLocator.workflowState = 

                      ModelLocator.VIEWING_CHECKOUT;" />   

 

<!-- the Wish List -->

<cart:ShoppingCart 

        id="wishListCartComp" 

        label="Wish List" 

        width="100%" height="100%" 

        shoppingCart="{ ModelLocator.wishList }" 

        selectedItem="{ ModelLocator.selectedItem }" 

        select="ModelLocator.selectedItem = event.target.selectedItem" 

        currencyFormatter="{ ModelLocator.currencyFormatter }" 

        addProduct="addProductToWishList( event );" 

        deleteProduct="deleteProductFromShoppingCart( event );" 

        gotoCheckout="ModelLocator.workflowState = 

                      ModelLocator.VIEWING_CHECKOUT;" />

 

</mx:TabNavigator>

转载于:https://www.cnblogs.com/jin20000/archive/2010/05/08/1730627.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值