[Unity] Button Imagesource not Binding to Datacontext
Posted: 24 Sep 2014, 01:10
I've recently been experiencing some difficulty while trying to create a button with a background image. The tooltip on the button is getting the datacontext, but for some reason i just can't get it do display a image. i've been able to get an image (as opposed to a button) to display an image using datacontext bind, but unable to get similar results on the button's background imagesource databind. Any thoughts would be appreciated. thanks for your continued support of this great product.
And here is the unity side of things. It's basically the noesis databinding video tutorial with a couple additions.
Thank you for taking a look at this!
Code: Select all
<Grid
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Name="UserControl"
d:DesignWidth="640" d:DesignHeight="480">
<Grid.Resources>
<DataTemplate x:Key="DataTemplate1">
<Grid>
<TextBlock HorizontalAlignment="Left" Height="20" Margin="0,0,-125.54,0" TextWrapping="Wrap" Text="{Binding Name}" VerticalAlignment="Top" Width="176"/>
</Grid>
</DataTemplate>
<DataTemplate x:Key="IconTemplate">
<Grid>
<Rectangle HorizontalAlignment="Left" Height="32.667" Margin="6.333,15.333,-39,-28" Stroke="Black" VerticalAlignment="Top" Width="52.667">
<Rectangle.Fill>
<ImageBrush ImageSource="{Binding Image}"/>
</Rectangle.Fill>
</Rectangle>
</Grid>
</DataTemplate>
<DataTemplate x:Key="iconstemplate">
<Grid d:DesignWidth="204.75" d:DesignHeight="184.792">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="161*"/>
<ColumnDefinition Width="43*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="176*"/>
<RowDefinition Height="0*"/>
<RowDefinition Height="9*"/>
</Grid.RowDefinitions>
<Button Content="Button" HorizontalAlignment="Left" Height="129" Margin="10,6.333,0,0" VerticalAlignment="Top" Width="132.667" ToolTip="{Binding ToolTip}">
//Start of the problem bindings here////////////////////////////////////Non of these work while the above
//ToolTip ="{Binding ToolTip works}" works fine. Hence the confusion.
<Button.Foreground>
<ImageBrush ImageSource="{Binding Image}"/>
</Button.Foreground>
<Button.Background>
<ImageBrush ImageSource="{Binding Image}"/>
</Button.Background>
<Button.BorderBrush>
<ImageBrush ImageSource="{Binding Image}"/>
</Button.BorderBrush>
//End of problem Bindings ********************************************************************
</Button>
</Grid>
</DataTemplate>
</Grid.Resources>
<Grid.Background>
<ImageBrush/>
</Grid.Background>
<ComboBox x:Name="comboBox" HorizontalAlignment="Left" Height="27.333" Margin="32,30.667,0,0" VerticalAlignment="Top" Width="203.667" ItemsSource="{Binding Animals}" ItemTemplate="{DynamicResource DataTemplate1}"/>
<Image HorizontalAlignment="Left" Height="187.333" Margin="29.333,93,0,0" VerticalAlignment="Top" Width="256.667" Source="{Binding SelectionBoxItem.Image, ElementName=comboBox}" ToolTip="{Binding ToolTip}"/>
<Button x:Name="Button1" Content="{Binding SelectionBoxItem.OtherName, ElementName=comboBox}" HorizontalAlignment="Left" Height="27.333" Margin="240.667,30.667,0,0" VerticalAlignment="Top" Width="65" ToolTip="{Binding SelectionBoxItem.ToolTip, ElementName=comboBox}"/>
<ListBox HorizontalAlignment="Left" Height="377" Margin="291,93,0,0" VerticalAlignment="Top" Width="339" ItemTemplate="{DynamicResource iconstemplate}" ItemsSource="{Binding Animals}"/>
</Grid>
And here is the unity side of things. It's basically the noesis databinding video tutorial with a couple additions.
Code: Select all
using UnityEngine;
using System.Collections;
using Noesis;
public class TestBind : MonoBehaviour {
// Use this for initialization
void Start () {
var tex1 = new TextureSource(Resources.Load("dixonPic") as Texture2D);
var tex2 = new TextureSource(Resources.Load("cylinders") as Texture2D);
var dixon = new Animal{Name = "Thing", Image = tex1, OtherName = "SillyWillyPants", ToolTip = "blah blah blah."};
var blueprint= new Animal{Name = "Blueprint", Image = tex2, OtherName = "GreenPumpkins", ToolTip = "That's right, Green!"};
var another = new Animal{Name = "Another", Image = tex2, OtherName = "thing", ToolTip = "Very much a thing"};
var noesisPanel = GetComponent<NoesisGUIPanel>();
var root= noesisPanel.GetRoot<Grid>();
var viewModel = new ViewModel();
Button _button = root.FindName<Button>("Button1");
_button.Click += HandleClick;
viewModel.Animals.Add(dixon);
viewModel.Animals.Add(blueprint);
viewModel.Animals.Add(another);
root.SetDataContext(viewModel);
}
void HandleClick (BaseComponent sender, RoutedEventArgs e)
{
Button button = sender.As<Button>();
Debug.LogError(button.GetName() + " was clicked!!");
}
// Update is called once per frame
void Update () {
}
}
[Noesis.Extended]
public class Animal: BaseComponent{
private string _Name;
private string _OtherName;
private string _ToolTip;
public string ToolTip {
get {
return _ToolTip;
}
set {_ToolTip = value;
NotifyPropertyChanged("ToolTip");
}
}
public string OtherName{
get{return _OtherName;}
set{_OtherName = value;
NotifyPropertyChanged("OtherName");}
}
public string Name {
get {
return _Name;
}
set {
_Name = value;
NotifyPropertyChanged("Name");
}
}
private ImageSource _Image;
public ImageSource Image {
get {
return _Image;
}
set {
_Image = value;
NotifyPropertyChanged("Image");
}
}
}
[Noesis.Extended]
public class ViewModel: BaseComponent{
public ViewModel(){
_Animals = new Collection();
}
private Collection _Animals;
public Collection Animals {
get {
return _Animals;
}
set {
_Animals = value;
NotifyPropertyChanged("Animals");
}
}
}