自定义ClassFactory,让DataGrid动态改变Button或Image等属性II

本文介绍了如何在Flex中使用自定义ClassFactory动态更改DataGrid中的图标,并通过IconUtility类实现运行时加载图片替换按钮图标的方法。
上一期提到Flex3 自定义ClassFactory,让DataGrid动态改变Button或Image等属性。但后来发现,里面的icon都是预先定义好的才可以。如果是用户后来上传的图片,该怎么把这些图片动态运用到按钮上去?前面是用Embed绑定到一个Class上,但是这种代码我无法用AS动态写出来,比如讲Embed里面的source的值用一个变量来表示。后来同事提供了一个链接给我:[url]http://blog.benstucki.net/?p=42[/url],Ben Stucki 写了一个类IconUtility,里面有个static方法getClass返回了一个Class。有了它在运行时动态加载一个图片,换了原来按钮的图片是没有问题的!牛人啊,不愧是Flex Consultant!但是如果直接搬到我原来的代码里,是行不通的。原代码如下:
dgc = new DataGridColumn();
dgc.dataField = oColumnDef.id.datafield;

//MyButton 是自定义组件,在其中添加了一些事件
var cf:ClassFactory=new MyClassFactory(MyButton,{label:"ok"},{icon:add});
dgc.itemRenderer=cf;
}
这里的add是一个已经绑定了图片的Class,用上牛人的方法要改写成如下:

dgc = new DataGridColumn();
dgc.dataField = oColumnDef.id.datafield;

//MyButton 是自定义组件,在其中添加了一些事件
var cf:ClassFactory=new CMSClassFactory(MyButton,{label:"ok"},{icon:IconUtility.getClass([color=red]MyButton的实例[/color], 'http://www.exampledomain.com/image.jp});
dgc.itemRenderer=cf;
}


问题出现了,这里如何得到MyButton的实例,我试了 new MyClassFactory(MyButton).newInstance(),无效。我后来又改写了我的MyClassFactory类

package com.yonghong.model
{
import mx.core.ClassFactory;

public class MyClassFactory extends ClassFactory
{
//styleCollection represents a collection of style
//properties represents a collection of property
private var styleCollection:Object;
public function CMSClassFactory(generator:Class=null,properties:Object=null,styleCollection:Object=null)
{
super(generator);
this.properties=properties;
this.styleCollection=styleCollection;

}

public override function newInstance():*
{
var instance:Object = new generator();

if (properties != null)
{
for (var p:String in properties)
{
instance[p] = properties[p];
}
}
if(styleCollection != null){
for(var s:String in styleCollection){
if(s=="icon")
instance.setStyle(s,IconUtility.getClass(instance as UIComponent,styleCollection[s]));
else
instance.setStyle(s,styleCollection[s]);
}
}

return instance;
}

下面是新的使用代码:
dgc = new DataGridColumn();
dgc.dataField = oColumnDef.id.datafield;

//MyButton 是自定义组件,在其中添加了一些事件
var cf:ClassFactory=new CMSClassFactory(MyButton,{label:"ok"},{icon:"http://www.exampledomain.com/image.jp"});
dgc.itemRenderer=cf;
}

以上说出我的思路而已,某些代码还有待改善。希望可以帮到一些朋友!
<Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto"></RowDefinition> <RowDefinition Height="Auto"></RowDefinition> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="30"/> </Grid.ColumnDefinitions> <StackPanel Orientation="Horizontal" Grid.Row="0"> <TextBlock Margin="10" Padding="7" VerticalAlignment="Center" HorizontalAlignment="Center" Height="30" Text="当前选中:"/> <TextBox x:Name="txtselect" Classes="Bordered" Width="360" Text="{Binding projectSelected1}" Watermark="请输入" IsEnabled="True" BorderBrush="White" IsReadOnly="True" HorizontalAlignment="Left" MaxLength="50" /> </StackPanel> <StackPanel Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Right"> <TextBox Watermark="请输入项目名称" BorderBrush="{x:Null}" Foreground="#7D7D7D" Height="30" Background="{x:Null}" VerticalAlignment="Center" HorizontalContentAlignment="Right" VerticalContentAlignment="Center" BorderThickness="0" Text="{Binding KeyWord}" /> <Button Height="28" Width="35" Padding="1" VerticalAlignment="Center" BorderThickness="1" HorizontalAlignment="Right" Margin="0,1" Command="{Binding refresh}" Background="#F1F2F5" > <!--<StackPanel Orientation="Horizontal" >--> <!--<Image Source="/Assets/Image/Icon/Search.png" Margin="-5,3,0,3" />--> <Image Source="/Assets/Image/Icon/Search.png" Width="30" Height="26" /> <!--</StackPanel>--> </Button> </StackPanel> <StackPanel Grid.Row="1"> <DataGrid Name="dgDataList" ItemsSource="{Binding MotbProject}" RowHeight="35" Margin="10" CanUserSortColumns="True" CanUserReorderColumns="True" CanUserResizeColumns="True" HorizontalAlignment="Stretch" > <DataGrid.Columns> <!--<DataGridTextColumn Header="项目编号" Binding="{Binding Projectid}"/>--> <!--<DataGridCheckBoxColumn Binding="{Binding IsSelect}" Width="65" />--> <DataGridTextColumn Header="项目名称" Binding="{Binding Projectname}" IsReadOnly="True" Width="0.7*" /> <DataGridTextColumn Header="数据格式" Binding="{Binding Detectormodel}" IsReadOnly="True" Width="0.7*"/> <DataGridTextColumn Header="检测器厂家" Binding="{Binding Detectorfactory}" IsReadOnly="True" Width="0.8*"/> <DataGridTextColumn Header="管道尺寸" Binding="{Binding Pipelinesize}" IsReadOnly="True" Width="0.8*"/> <DataGridTextColumn Header="创建时间" Binding="{Binding Path=Createdate,StringFormat='yyyy-MM-dd'}" IsReadOnly="True" Width="1.6*" SortMemberPath="Createdate"/> <DataGridTemplateColumn Header="操作" IsReadOnly="True" CanUserResize="False" CanUserSort="False" Width="0.8*" > <DataGridTemplateColumn.CellTemplate> <DataTemplate> <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center" Height="25"> <Button Name="btn_open" DataContext="{Binding $parent.DataContext}" x:DataType="vm:SampleWindowModel" Command="{Binding OpenItem}" CommandParameter="{Binding $parent.DataContext}" Content="设为选中" Classes="functionBtn" Margin="0" Height="25" Width="60" Padding="0,1,0,0" /> </StackPanel> </DataTemplate> </DataGridTemplateColumn.CellTemplate> </DataGridTemplateColumn> </DataGrid.Columns> </DataGrid> </StackPanel> </Grid> datagrid在打开页面时数据不显示,点击名头排序才显示数据
06-20
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值