Andrew Truckle
Andrew Truckle

Reputation: 19207

How to set a secondary control MaxWidth property to the same as another in a different container

I have this StackPanel in one grid on my form:

<StackPanel x:Name="panelWeelyBibleReading" Grid.Row="2" Grid.Column="0" Margin="2">
    <Label>Bible Reading for Week:</Label>
    <TextBox x:Name="textWeeklyBibleReading">PSALMS 60-68</TextBox>
</StackPanel>
<StackPanel Grid.Row="3" Grid.Column="0" Margin="2">
    <Label>Opening Song:</Label>
    <ComboBox x:Name="comboSongOpen" ItemsSource="{StaticResource SongTitles}">
        <ComboBox.ItemTemplate>
            <DataTemplate DataType="local:SongTitleItem">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Number, StringFormat='000 - '}" />
                    <TextBlock Text="{Binding Title}" />
                </StackPanel>
            </DataTemplate>
        </ComboBox.ItemTemplate>
        <ComboBox.MaxWidth>
            <Binding Path="ActualWidth" 
                ElementName="textWeeklyBibleReading"/>
        </ComboBox.MaxWidth>
    </ComboBox>
</StackPanel>

Further down the form in a different grid I have this :

<StackPanel Grid.Row="3" Grid.Column="0" Margin="2">
    <Label>Closing Song:</Label>
    <ComboBox x:Name="comboSongEnd" ItemsSource="{StaticResource SongTitles}">
        <ComboBox.ItemTemplate>
            <DataTemplate DataType="local:SongTitleItem">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Number, StringFormat='000 - '}" />
                    <TextBlock Text="{Binding Title}" />
                </StackPanel>
            </DataTemplate>
        </ComboBox.ItemTemplate>
        <ComboBox.MaxWidth>
            <Binding Path="ActualWidth" 
                ElementName="panelWeeklyBibleReading.textWeeklyBibleReading"/>
        </ComboBox.MaxWidth>
    </ComboBox>
</StackPanel>

Initially I tried using the same "textWeeklyBibleReading" for the MaxWidth in the second combo. But it doesn't work. No warnings. Just doesn't work. So I thought about applying a name to the previous StackPanel in teh hopes I could use it as some kind of access point. But it still doesn't work.

So my problem is that I need to set the MaxWidth on the second combo, which is in a different grid, but using the value that was calculated on the first grid combo. Am I making sense?

I would show the complete form markup if it helps.

Upvotes: 1

Views: 37

Answers (1)

StepUp
StepUp

Reputation: 38209

You should edit to:

<ComboBox.MaxWidth>
   <Binding Path="Width" 
            ElementName="textWeeklyBibleReading"/>
</ComboBox.MaxWidth>
<Binding Path=Width, ElementName=textWeeklyBibleReading/>

cause there is no property such as ActualWidth, instead it should be Width. And there is no need to write container name panelWeeklyBibleReading, just write ElementName that you need.

Update:

<ComboBox.ItemTemplate>
  <DataTemplate DataType="local:SongTitleItem">
    <StackPanel Orientation="Horizontal" MaxWidth="{Binding Path=Width, 
                                  ElementName=textWeeklyBibleReading}">
      <TextBlock Text="{Binding Number, StringFormat='000 - '}" />
      <TextBlock Text="{Binding Title}" />
    </StackPanel>
  </DataTemplate>
</ComboBox.ItemTemplate>

You should set MaxWidth of StackPanel of ComboBox cause outer StackPanel``(<StackPanel Grid.Row="3" Grid.Column="0" Margin="2">) which contains your ComboBox automatically sets Width to the outer StackPanel to your ComboBox. So I suggest to bind Width of your ComboBox to its ItemTemplate. Cause ItemTemplate has Data/template, then it is better to bind Width of ComboBox to StackPanel located into your DataTemplate.

Upvotes: 1

Related Questions