Load Image from Oracle BLOB into WPF Image Control

Almost forgot. In my last tutorial, I tell you how to save Image / Photo into oracle database. But, there is another problem, how to read and view it from oracle database? Don’t worry, it’s very easy to do that. Just follow these steps and you’ll able to load Image from oracle database. And one thing, I’m using DataBinding technique in this tutorial, so you have to learn abut it first. Unfortunately, I’m too lazy to write about it . So, maybe next time I’ll write about DataBinidng in WPF.

1. Create a new WPF application (don’t tell me you don’t know how ). Name it WpfLoadOracleBlob.

2. Now, we’re still using database from the last tutorial. So, you don’t need to make a new table or something. Modify your window to become like picture below.

I know most of you are lazy, so copy the xaml code below:

<Window x:Class="WpfLoadOracleBlob.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300" Loaded="Window_Loaded">
    <Grid>
        <ComboBox Height="23" Margin="12,12,12,0" Name="comboBox1" 
                  VerticalAlignment="Top" ItemsSource="{Binding}">
            <ComboBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Path=ROWNUM}" />
                </DataTemplate>
            </ComboBox.ItemTemplate>
        </ComboBox>
        <Image Margin="12,41,12,12" Name="image1" Stretch="Fill" 
               Source="{Binding ElementName=comboBox1, 
                Path=SelectedItem.GAMBAR_BIN}"/>
    </Grid>
</Window>

Look at the xaml code, you’ll see some {Binding} things. You wanna know about it? Then googling it

3. Okey, let’s get into the logic. Here is the code you need to load image from database to WPF Image control

using System.Windows;
using System.Data.OracleClient;
using System.Data;

namespace WpfLoadOracleBlob
{
 /// <summary>
 /// Interaction logic for Window1.xaml
 /// </summary>
 public partial class Window1 : Window
 {
  public Window1()
  {
   InitializeComponent();
  }

  private void Window_Loaded(object sender, RoutedEventArgs e)
  {
   OracleConnection conn = new OracleConnection(
   "Data Source=localhost;" +
   "Persist Security Info=True;" +
   "User ID=C07;Password=C07;Unicode=True");
   conn.Open();

   OracleDataAdapter ad = new OracleDataAdapter(
   "SELECT ROWNUM, GAMBAR_BIN FROM GAMBAR",
   conn);

   DataTable tb = new DataTable();
   ad.Fill(tb);
   comboBox1.DataContext = tb;

   conn.Close();
  }
 }
}

the key is in comboBox1.DataContext = tb; It means that comboBox1 Bind the data from your SELECT Query.

4. Now test your project and see the result of your work.



Okay, that’s all I can tell you. If you have any questions just leave it to the comment . CodeProject