TextBlock an TextBox.Text binden

  • WPF

Es gibt 4 Antworten in diesem Thema. Der letzte Beitrag () ist von BlackTears.

    TextBlock an TextBox.Text binden

    Hallo zusammen,

    ich komm grad wieder nicht weiter bei meinem Projekt. Ich habe meine Anwendung erweitert, so dass ein User ein paar Eingaben tätigen kann. Das habe ich wie üblich über eine ObservableCollection gelöst. Funktioniert auch.

    Spoiler anzeigen

    VB.NET-Quellcode

    1. ​Public Property Eingabeliste As ObservableCollection(Of Eingaben_MainView) = New ObservableCollection(Of Eingaben_MainView)
    2. With Eingabeliste
    3. .Add(New Eingaben_MainView("A", ""))
    4. .Add(New Eingaben_MainView("B", ""))
    5. .Add(New Eingaben_MainView("C", ""))
    6. .Add(New Eingaben_MainView("D", ""))
    7. .Add(New Eingaben_MainView("E", ""))
    8. End With


    Die Klasse Eingaben_MainView sieht so aus:

    Spoiler anzeigen

    VB.NET-Quellcode

    1. ​Namespace Eingabe
    2. Public Class Eingaben_MainView
    3. Public _EingabeContent As String
    4. Public Property EingabeContent As String
    5. Get
    6. EingabeContent = _EingabeContent
    7. End Get
    8. Set(value As String)
    9. _EingabeContent = value
    10. End Set
    11. End Property
    12. Public _EingabeText As String
    13. Public Property EingabeText As String
    14. Get
    15. EingabeText = _EingabeText
    16. End Get
    17. Set(value As String)
    18. _EingabeText = value
    19. If EingabeContent = "A" AndAlso EingabeText <> "" Then
    20. MessageBox.Show("Text geändert")
    21. End If
    22. End Set
    23. End Property
    24. Public Sub New(LabelContent As String, TextBoxText As String)
    25. EingabeContent = LabelContent
    26. EingabeText = TextBoxText
    27. End Sub
    28. End Class
    29. End Namespace


    Im Setter von EingabeText gebe ich immer Rückmeldung, wenn sich der Wert ändert. Passt und funktioniert. Jetzt soll aber der aktuelle Text aus Eingabe "A" auch in einem Textblock angezeigt werden.

    Hier die XAML:
    Spoiler anzeigen

    XML-Quellcode

    1. ​<Window x:Class="MainWindow"
    2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    4. xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    5. xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    6. xmlns:local="clr-namespace:Checkbox_Test"
    7. xmlns:pkl="clr-namespace:Checkbox_Test.Produktklasse"
    8. mc:Ignorable="d"
    9. Title="ProFriCon" Height="800" Width="1200">
    10. <StackPanel>
    11. <StackPanel Orientation="Horizontal" Margin="10">
    12. <ItemsControl ItemsSource="{Binding Eingabeliste}" Focusable="False">
    13. <ItemsControl.ItemTemplate>
    14. <DataTemplate>
    15. <WrapPanel Width="300" Margin="0,2">
    16. <Label Content="{Binding EingabeContent}" Width="155" HorizontalContentAlignment="Right" />
    17. <TextBox Text="{Binding EingabeText, UpdateSourceTrigger=PropertyChanged}" Width="140" MinHeight="20"/>
    18. </WrapPanel>
    19. </DataTemplate>
    20. </ItemsControl.ItemTemplate>
    21. </ItemsControl>
    22. <GroupBox Header="Produktauswahl" Margin="25,0,0,0" Padding="5" >
    23. <ItemsControl ItemsSource="{Binding Checkboxliste}" HorizontalAlignment="Right" Margin="10,0" Focusable="False">
    24. <ItemsControl.ItemTemplate>
    25. <DataTemplate>
    26. <CheckBox Content="{Binding neuesProdukt}" IsChecked="{Binding IsChecked}" Margin="2" FontSize="14"/>
    27. </DataTemplate>
    28. </ItemsControl.ItemTemplate>
    29. </ItemsControl>
    30. </GroupBox >
    31. </StackPanel>
    32. <ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled" >
    33. <StackPanel Orientation="Horizontal" Margin="0,25,0,0">
    34. <Button Height="105" Width="80" Margin="5" VerticalAlignment="Top">
    35. <StackPanel >
    36. <Image Source="Pictures/Start.png"/>
    37. <TextBlock Text="{Binding EingabeText}"/>
    38. </StackPanel>
    39. </Button>
    40. <ItemsControl ItemsSource="{Binding Produktliste}" Margin="5">
    41. <ItemsControl.ItemTemplate>
    42. <DataTemplate>
    43. <Border Padding="5" BorderBrush="Black" BorderThickness="1" CornerRadius="5" Margin="5,0">
    44. <Grid Width="80">
    45. <Grid.RowDefinitions>
    46. <RowDefinition Height="60"/>
    47. <RowDefinition Height="*"/>
    48. </Grid.RowDefinitions>
    49. <Button Command="{Binding DataContext.Klick, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}}}"
    50. CommandParameter="{Binding}" HorizontalAlignment="Center" Width="80">
    51. <Image Source="{Binding Produktbild}" Stretch="Uniform"/>
    52. </Button>
    53. <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="0,5,0,0">
    54. <Button Name="btnBackward" Width="30" Height="30"
    55. Command="{Binding DataContext.Back, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}}}"
    56. CommandParameter="{Binding}">
    57. <Image Stretch="UniformToFill" Source="{Binding Zurueck}" />
    58. </Button>
    59. <Button Name="btnForward" Width="30" Height="30"
    60. Command="{Binding DataContext.Forward, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}}}"
    61. CommandParameter="{Binding}" Margin="20,0,0,0">
    62. <Image Source="{Binding Vor}"/>
    63. </Button>
    64. </StackPanel>
    65. </Grid>
    66. </Border>
    67. </DataTemplate>
    68. </ItemsControl.ItemTemplate>
    69. <ItemsControl.ItemsPanel>
    70. <ItemsPanelTemplate>
    71. <WrapPanel HorizontalAlignment="Left"/>
    72. </ItemsPanelTemplate>
    73. </ItemsControl.ItemsPanel>
    74. </ItemsControl>
    75. </StackPanel>
    76. </ScrollViewer>
    77. <TabControl ItemsSource="{Binding Produktliste}" SelectedItem="{Binding SelectedProdukt}">
    78. <TabControl.ContentTemplate>
    79. <DataTemplate>
    80. <ContentControl Content="{Binding}">
    81. <ContentControl.Resources>
    82. <DataTemplate DataType="{x:Type pkl:Standardbauteil}">
    83. <Image Source="{Binding Produktbild}" Width="42" Height="42" Stretch="UniformToFill"/>
    84. </DataTemplate>
    85. <DataTemplate DataType="{x:Type pkl:Bauteil_1}">
    86. <StackPanel>
    87. <Image Source="{Binding Produktbild}" Width="42" Height="42" Stretch="UniformToFill"/>
    88. <Button Content="{Binding Button}"/>
    89. </StackPanel>
    90. </DataTemplate>
    91. <DataTemplate DataType="{x:Type pkl:Bauteil_2}">
    92. <ListBox>
    93. <UniformGrid Columns="4">
    94. <Image Source="{Binding Produktbild}" Width="42" Height="42" Stretch="UniformToFill"/>
    95. <Button Content="{Binding Button}"/>
    96. <Button Content="{Binding Button}"/>
    97. <Button Content="{Binding Button}"/>
    98. </UniformGrid>
    99. </ListBox>
    100. </DataTemplate>
    101. </ContentControl.Resources>
    102. </ContentControl>
    103. </DataTemplate>
    104. </TabControl.ContentTemplate>
    105. </TabControl>
    106. </StackPanel>
    107. </Window>


    In Zeile 14 - 23 wird die Eingabeliste erstellt. In Zeile 36 erstellt ich einen Button mit einem Bild und einem TextBlock. Wie bekomme ich jetzt den Wert aus Eingabe "A" in den TextBlock?

    Über Binding, klar! Wenn ich aber wie gezeigt auf EingabeText binde, kommt der Fehler:

    Spoiler anzeigen

    VB.NET-Quellcode

    1. ​System.Windows.Data Error: 40 : BindingExpression path error: 'EingabeText' property not found on 'object' ''MainViewModel' (HashCode=8622890)'. BindingExpression:Path=EingabeText; DataItem='MainViewModel' (HashCode=8622890); target element is 'TextBlock' (Name=''); target property is 'Text' (type 'String')


    Das heißt er sucht in MainViewModel nach der Property, ich will aber dass die gleiche Property verwendet wird, wie für das Eingabefeld. Geht das? Wenn ja wie? Die Tutorials habe ich mir wiederholt angesehen, konnte das aber nicht umsetzen :S .

    Danke im Voraus!

    Gruß Oli
    Dateien
    • Checkbox_Test.zip

      (2,68 MB, 198 mal heruntergeladen, zuletzt: )
    Hallo

    Das ist richtig. Woher soll die WPF denn wissen WAS sie da reinschreiben soll?
    Welches Item willst du denn da drinnen stehen haben? Das kann die WPF nicht wissen.

    Du bist ja auch ausserhalb des "Produkts" also kannst du nicht darauf binden.
    Ich habe dir deine Bindinghirarchie mal signalisiert. vieleicht wird es dir dann klarer.


    Hellrot = Dein MainViewModel
    Hellblau = Die Eingabeliste innerhalb des MainViewModels
    Hellgrün = Produktliste innerhalb des MainViewModels
    Dunkelgrün = Ein Item innerhalb der Produktliste

    Der von dir gemeinte Button mit dem TextBlock befindet sich im Scope des MainViewModels. Was soll der denn anzeigen?
    So wie du dir das denkst hast du einen Designfehler. Am besten du zeigst mal WAS du genau erreichen willst und wie es aussehen soll. Hast du sowas wie ne Skizze?

    Grüße
    Sascha
    If _work = worktype.hard Then Me.Drink(Coffee)
    Seht euch auch meine Tutorialreihe <WPF Lernen/> an oder abonniert meinen YouTube Kanal.

    ## Bitte markiere einen Thread als "Erledigt" wenn deine Frage beantwortet wurde. ##

    Hallo Sascha,

    danke erstmal für Deine Veranschaulichung, hilft mir. Anscheinend habe ich aber das Problem falsch beschrieben. Gedacht habe ich das so:



    Hier gibt der User was ein und das soll in dem TextBlock angezeigt werden. Für Dich wahrscheinlich ein Kinderspiel, aber ich krieg das irgendwie nicht hin.

    Gruß

    Oli
    Hallo

    BlackTears schrieb:

    Gedacht habe ich das s

    Ich glaube zwar nicht das dich das weiterbringt aber gut.

    XML-Quellcode

    1. <StackPanel >
    2. <Image Source="Pictures/Start.png"/>
    3. <TextBlock Text="{Binding Eingabeliste[0].EingabeText}"/>
    4. </StackPanel>


    Weil der DatenKontext in dem Bereich in dem die Controls sich befinden das MainViewModel ist muss erstmal auf die "Eingabeliste" gebunden werden. Denn dieses befindet sich im MainViewModel.
    Dort den ersten Eintrag [0] und dort auf die Eigenschaft "EingabeText".

    Grüße
    Sascha
    If _work = worktype.hard Then Me.Drink(Coffee)
    Seht euch auch meine Tutorialreihe <WPF Lernen/> an oder abonniert meinen YouTube Kanal.

    ## Bitte markiere einen Thread als "Erledigt" wenn deine Frage beantwortet wurde. ##