也来一篇关于Infragistics WPF Report的使用教程 (一)

前言

Infragistics Report是一款比較灵活的报表控件, 比微软的rdlc控件至少在页面打印上, 页面的控制比較好调整.

这里使用的是Infragistics Ultimate  v14.1 试用版

开发工具是Visual Studio 2013 Framework 4.0 WPF Windows应用程序.

加入报表

将XamReportViewer从左側的工具栏中拖到右側的窗口中.

<ig:XamReportViewer HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
</ig:XamReportViewer>

系统会自己主动的加入引用, 记住这些引用,公布的时候, 把这些引用一并打包. 这样在client执行时就不会出现故障了.

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdzU5ODc5MjEz/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">

1. 先定义一个Person的类, 实现INofifyPropertyChanged接口.

   public class Person:INotifyPropertyChanged
    {
        #region  Implement of INotifyProeprtyChanged.
        public event PropertyChangedEventHandler PropertyChanged;

        private void OnPropertyChanged(string propertyName)
        {
            PropertyChangedEventHandler handler = this.PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
        #endregion

        private string _name;
        private int _age;
        private byte[] _profilePhoto;
        public string Name
        {
            get { return _name; }
            set { _name = value;
                OnPropertyChanged("Name");
            }
        }

        public int Age
        {
            get { return _age; }
            set { _age = value; OnPropertyChanged("Age"); }
        }

        public byte[] ProfilePhoto
        {
            get { return _profilePhoto; }
            set { _profilePhoto = value; OnPropertyChanged("ProfilePhoto"); }
        }
    }

2. 我们再定义一个MainWindowViewModel, 用于关联MainWindow.xaml的DataContext.

在MainWindow.xaml 中我们要New出一个 MainWindowViewModel的实体, 并对实体中的属性赋值. 这样才干够将相应的參数绑定到报表中. 即MVVM模式.

public class MainWindowViewModel : INotifyPropertyChanged
    {
        #region  Implement of INotifyProeprtyChanged.

        public event PropertyChangedEventHandler PropertyChanged;

        private void OnPropertyChanged(string propertyName)
        {
            PropertyChangedEventHandler handler = this.PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }

        #endregion

        private ObservableCollection<Person> _personCollection;
        private DateTime _printDateTime;

        public ObservableCollection<Person> PersonCollection
        {
            get { return _personCollection; }
            set
            {
                _personCollection = value;
                OnPropertyChanged("PersonCollection");
            }
        }

        public DateTime PrintDateTime
        {
            get { return _printDateTime; }
            set
            {
                _printDateTime = value;
                OnPropertyChanged("PrintDateTime");
            }
        }
    }

创建报表

加入数据源

1. 创建报表, 安装Infragistics之后, 新加入项目的时候, 会有一项infragistics, 按图所看到的, 加入报表.

2. 创建数据源

通过Report Data Explorer工具栏, 右击, 选择 DataSource - Add new Data Source,

在后面弹出的窗体中选择"Object Data Source", 点击下一步,

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdzU5ODc5MjEz/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" width="300" height="300" alt="">

选择我们刚刚定义好的MainWindowViewModel.cs, 这里须要注意一下, 在创建编辑好MainViewModel.cs之后, 须要编译一下, 加入数据源的时候才干显示出来. 否则是不会显示的.

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdzU5ODc5MjEz/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">

加入參数

加入參数的相对简单, 从左側的Report Data Explorer中右击Parameter, 选择"Add Static Value List Parameter", 输入參数名称就可以.

加入完毕之后,  点击OK就可以, 然后将数据源, 參数直接拖到右側的报表区域中.

绑定參数

绑定的參数之后的代码

        <ig:XamReportViewer HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
            <ig:XamReportViewer.RenderSettings>
                <ig:ClientRenderSettings  DefinitionUri="/InfragisticsReportSample;component/Person.igr">
                    <ig:ClientRenderSettings.DataSources>
                        <ig:DataSource TargetDataSource="Person" ItemsSource="{Binding PersonCollection}"/>
                    </ig:ClientRenderSettings.DataSources>
                </ig:ClientRenderSettings>
            </ig:XamReportViewer.RenderSettings>
            <ig:XamReportViewer.Parameters>
                <ig:Parameter ParameterName="PrintDate" ParameterValue="{Binding PrintDateTime}"/>
            </ig:XamReportViewer.Parameters>
        </ig:XamReportViewer>

TargetDataSource = "Person" 指的是绑定的Collection的类型为Person

ItemsSource = "{Binding PersonCollection}" 指的是绑定数据源为PersonCollection

Parametername = "PrintDate" 是指我们在报表中创建的參数名称为PrintDate,  ParameterValue = {Binding PrintDateTime} 是指绑定PrintDateTime的属性.

加入数据

在创建出MainWindowViewModel的时候, 指定数据源, 就能够显示出报表了.

       public MainWindow()
        {
            InitializeComponent();

            MainWindowViewModel model = new MainWindowViewModel();

            model.PersonCollection = new ObservableCollection<Person>();
            model.PrintDateTime = DateTime.Now;

            Person p = new Person();
            p.Name = "哆拉A梦";
            p.Age = 99;
            p.ProfilePhoto = GetByteImage("doraemon.jpg");
            model.PersonCollection.Add(p);

            p = new Person();
            p.Name = "阿拉蕾";
            p.Age = 100;
            p.ProfilePhoto = GetByteImage("arale.jpg");
            model.PersonCollection.Add(p);

            this.DataContext = model;
        }

        public byte[] GetByteImage(string imagepath)
        {
            FileStream fs = new FileStream(imagepath, FileMode.Open);
            byte[] byData = new byte[fs.Length];
            fs.Read(byData, 0, byData.Length);
            fs.Close();
            return byData;
        }
    }

最后的报表结果