DataTemplate is not generating ListItemBox

Question

I want to generate ListItemBox using DataTemplate but items are not generating. Please guide me where is the mistake. I have following code in MainWindow.xaml.

<Window x:Class="Offline_Website_Downloader.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:bd="clr-namespace:Offline_Website_Downloader"
    Title="Offline Website Downloader" Background="#f5f6f7" Height="500" Width="800"
    WindowStartupLocation="CenterScreen">

<Window.Resources>

    <bd:BindingController x:Key="BindingControllerKey"  />

    <DataTemplate x:Key="DownloadedWebsitesListBox">

            <StackPanel Orientation="Vertical">
                <StackPanel Orientation="Horizontal" Width="Auto">

                    <TextBlock FontWeight="Bold" FontSize="18" Width="480">
                            <Hyperlink NavigateUri="http://google.com">
                                <Label Content="{Binding Path=WebsiteTitle}" />
                            </Hyperlink>
                    </TextBlock>

                    <TextBlock Width="132" TextAlignment="right">
                            <TextBlock Text="Remaining Time: "/>
                            <TextBlock Name="TimeRemaining" Text="js"/>
                </TextBlock>

                </StackPanel>
                <StackPanel Orientation="Horizontal">
                    <ProgressBar Name="progress1" Maximum="100" Minimum="0" Value="30" Background="#FFF" Width="612" Height="10" />
                </StackPanel>
                <StackPanel Orientation="Horizontal">
                <TextBlock HorizontalAlignment="Left" Width="450">Status: <TextBlock Text="{Binding Path=Status}"/></TextBlock>
                    <TextBlock Width="162" TextAlignment="right">
                                    <TextBlock Text="Downloading Speed: "/>
                                    <TextBlock Name="DownloadingSpeed" Text="{Binding Path=DownloadingSpeed}"/>
                            </TextBlock>
                </StackPanel>
            </StackPanel>

    </DataTemplate>

</Window.Resources>

<Grid>
<ListBox Width="Auto" 
                 Name="WebsiteList"
                 Grid.Column="1" 
                 Grid.Row="2" 
                 Grid.RowSpan="2"
                 ItemsSource="{Binding}"
                 ItemTemplate="{StaticResource DownloadedWebsitesListBox}"
                 Margin="0,0,0,0">
</ListBox>
</Grid>
</window>

and MainWindow.xaml.cs

    BindingController bc = new BindingController();
    public MainWindow()
    {
        InitializeComponent();

           bc.DownloadingSpeed = "40kb/s";
            bc.WebsiteTitle = "WebsiteTitle";
            bc.Status = "Downloading";
            DataContext = bc;
}

and BindingController.cs

   public class BindingController
   {
    public BindingController()
    {

    }

    private string _WebsiteTitle;
    public string WebsiteTitle
    {
        set { _WebsiteTitle = value; }
        get { return _WebsiteTitle; }
    }

    private string _Status;
    public string Status
    {
        set { _Status = value ; }
        get { return _Status ; }
    }

    private string _DownloadStartDate;
    public string DownloadStartDate
    {
        set { _DownloadStartDate = value; }
        get { return _DownloadStartDate ; }
    }

    private string _DownloadingSpeed = "0 kb/s";
    public string DownloadingSpeed
    {
        set { _DownloadingSpeed = value; }
        get { return _DownloadingSpeed; }
    }

}

Answer 1

Your problem is that you're binding a ListBox to an object that contains several properties, but really only represents a single object/state. The ListBox expects to display a list of items (i.e. IList, IBindingList, IEnumerable, ObservableCollection).

Assuming you want to display more than one download at a time, which I'm assuming given that you're using a ListBox, I would refactor the download properties into a separate class. You will also need to implement INotifyPropertyChanged on your properties so that when the values are changed, they will be shown in the UI.

public class Download : INotifyPropertyChanged
{
    private string _WebsiteTitle;
    public string WebsiteTitle
    {            
        get { return _WebsiteTitle; }
        set
        {
            if (_WebsiteTitle == value)
                return;

            _WebsiteTitle = value;
            this.OnPropertyChanged("WebsiteTitle");
        }
    }

    private string _Status;
    public string Status
    {
        get { return _Status; }
        set
        {
            if (_Status == value)
                return;

            _Status = value;
            this.OnPropertyChanged("Status");
        }
    }

    private string _DownloadStartDate;
    public string DownloadStartDate
    {
        get { return _DownloadStartDate; }
        set
        {
            if (_DownloadStartDate == value)
                return;

            _DownloadStartDate = value;
            this.OnPropertyChanged("DownloadStartDate");
        }
    }

    private string _DownloadingSpeed = "0 kb/s";
    public string DownloadingSpeed
    {
        get { return _DownloadingSpeed; }
        set
        {
            if (_DownloadingSpeed == value)
                return;

            _DownloadingSpeed = value;
            this.OnPropertyChanged("DownloadingSpeed");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

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

The new BindingController:

public class BindingController
{
    public BindingController()
    {
        this.Downloads = new ObservableCollection<Download>();
    }

    public ObservableCollection<Download> Downloads { get; private set; }
}

Setting up the bindings in XAML:

<ListBox Width="Auto" 
         Name="WebsiteList"
         Grid.Column="1" 
         Grid.Row="2" 
         Grid.RowSpan="2"             
         ItemsSource="{Binding Downloads}"
         ItemTemplate="{StaticResource DownloadedWebsitesListBox}"
         Margin="0,0,0,0">
</ListBox>

Initializing the collection in MainWindow

Download download = new Download();
download.DownloadingSpeed = "40kb/s";
download.WebsiteTitle = "WebsiteTitle";
download.Status = "Downloading";
bc.Downloads.Add(download);

this.DataContext = bc;