从DB到expandderviewer的图像

时间:2013-11-22 16:51:22

标签: c# list xaml bitmapimage expander

尝试将sqlite数据库中的图像添加到expandderviewer中。在将数据转换为BitmapImage之前,代码以db中的字节形式将图像拉出。所有这些都可以工作,因为可以在扩展器查看器外部的imageview中查看图片。

但是,只有一个大的空白区域出现在图像应该位于扩展器查看器中。

我已将C#和XAML的样本放在下面。

任何帮助都会非常感激。

    public partial class CarExpander : PhoneApplicationPage
    {    
        ObservableCollection<Cars_Out_Table> _carEntries = null;
        static BitmapImage BmImage = new BitmapImage();
        static BitmapImage BmImage2 = new BitmapImage();

        // Constructor
        public CarExpander()
        {
            InitializeComponent();
            this.Loaded += new RoutedEventHandler(MainPage_Loaded);
        }

        void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            string strSelectCar2 = "SELECT Championship_ID,Car_ID,Driver_Name,Team_Name FROM Cars_Table ORDER BY Championship_ID, Car_ID";
            _carEntries = (Application.Current as App).db.SelectObservableCollection<Cars_Out_Table>(strSelectCar2);

            foreach (Cars_Out_Table data in _carEntries)
            {
                string strSelectCar = "SELECT Car_Picture FROM Cars_Table where Car_ID="+data.Car_ID;
                (Application.Current as App).db.SimpleQuery<Cars_Table>(strSelectCar);

                new Cars_Out_Table() { Championship_ID = data.Championship_ID, Car_ID = data.Car_ID, Driver_Name = data.Driver_Name, Team_Name = data.Team_Name, Car_Picture=bytetoimage()};
            }
            ListCars.DataContext = typeof(Cars_Out_Table);
            ListCars.ItemsSource = _carEntries;   
        }

        private static BitmapImage bytetoimage()
        {
            var isoStore = IsolatedStorageFile.GetUserStoreForApplication();
            using (MemoryStream ms = new MemoryStream(GlobalVariables.picByte, 0, GlobalVariables.picByte.Length))
            {
                ms.Write(GlobalVariables.picByte, 0, GlobalVariables.picByte.Length);
                BmImage.SetSource(ms);
                return BmImage;
            }
        }
    }


 <ListBox x:Name="ListCars">
                <ListBox.ItemContainerStyle>
                    <Style TargetType="ListBoxItem">
                        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                    </Style>
                </ListBox.ItemContainerStyle>
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <toolkit:ExpanderView x:Name="Expander" Margin="0,0,0,8" Header="{Binding ''}" Expander="{Binding ''}" ItemsSource="{Binding}"  >
                            <toolkit:ExpanderView.HeaderTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Driver_Name}" FontSize="{StaticResource PhoneFontSizeLarge}" Foreground="{StaticResource PhoneAccentBrush}" />
                                </DataTemplate>
                            </toolkit:ExpanderView.HeaderTemplate>
                            <toolkit:ExpanderView.ExpanderTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Championship_ID}"/>
                                </DataTemplate>
                            </toolkit:ExpanderView.ExpanderTemplate>
                            <StackPanel Margin="0,0,0,0" Width="300">
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="Car Number:"/>
                                    <TextBlock Text="{Binding Car_ID}"/>
                                </StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="Team Name:"/>
                                    <TextBlock Text="{Binding Team_Name}"/>
                                </StackPanel>
                            </StackPanel>
                            <Image Visibility="Visible" Margin="172,10,116,428">
                                <Image.Source>
                                    <BitmapImage  UriSource="{Binding Car_Picture}"/>
                                </Image.Source>
                            </Image>
                        </toolkit:ExpanderView>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>

1 个答案:

答案 0 :(得分:0)

问题解决了!

您可以创建一个处理转换的类,并在source属性的converter属性中引用此类,而不是在传递给imagebox之前尝试转换。

XAML:

<Grid.Resources>
            <local:ByteToImageConverter x:Key="BinaryConverter"/>
        </Grid.Resources>
<Image Source= "{Binding Car_Picture, Converter={StaticResource BinaryConverter}}" />

C#:

public class ByteToImageConverter : IValueConverter
    {
        public BitmapImage ConvertByteArrayToBitMapImage(byte[] imageByteArray)
        {
            BitmapImage img = new BitmapImage();
            using (MemoryStream memStream = new MemoryStream(imageByteArray))
            {
                img.SetSource(memStream);
            }
            return img;
        }
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            BitmapImage img = new BitmapImage();
            if (value != null)
            {
                img = this.ConvertByteArrayToBitMapImage(value as byte[]);
            }
            return img;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return null;
        }
    }