2009-07-10 3 views
1

현재 WPF 응용 프로그램의 레이아웃을 연구 중이며 컨트롤 중 하나의 레이아웃에 약간의 걸림돌이있는 것 같습니다. 이 컨트롤은 동적으로 크기가 조정되므로 뷰포트의 크기에 맞아야합니다. 내가 겪고있는 문제는 매우 시각적 인 문제이므로 그것을 설명하기 위해 최선을 다할 것입니다. 여기이 순간에 어떻게 표시되는지를 보여줍니다 :동적으로 WPF TextBlock 크기를 조정할 때 성능이 저하되었습니다.

alt text http://gallery.me.com/theplatz/100006/Capture/web.png?ver=12472534170001

은 "골 N 행 X"헤더의 각 아래 지역은 다양한 길이의 텍스트가 배치됩니다 TextBlock의입니다. 실제로 TextBlock을 감싸기 위해 텍스트 블록의 너비를 열의 너비에 바인딩하는 stackoverflow 솔루션을 발견했습니다. 여기에 그리드 정의의 조각은 첫 번째 열에 대한 정의와 함께입니다 : 창/뷰포트의 폭이 증가 할 때

<!-- Change Detail Contents Grid --> 
<Grid Grid.Row="1"> 
    <Grid.ColumnDefinitions> 
    <ColumnDefinition MinWidth="270" Width="2*" /> 
    <ColumnDefinition MinWidth="160" Width="*" /> 
    <ColumnDefinition MinWidth="160" Width="*" /> 
    <ColumnDefinition MinWidth="160" Width="*" /> 
    </Grid.ColumnDefinitions> 

    <!-- 
    We bind the width of the textblock to the width of this border to make sure things resize correctly. 
    It's important that the margin be set to 1 larger than the margin of the textblock or else you'll end 
    up in an infinate loop 
    --> 
    <Border Grid.Column="0" Margin="6" Name="FirstBorder" /> 
    <Border Grid.Column="0" BorderThickness="0,0,1,0" BorderBrush="{DynamicResource ColumnBorderBrush}"> 
    <Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="*" /> 
    </Grid.RowDefinitions> 

    <StackPanel Grid.Row="0"> 
     <Border Style="{DynamicResource DetailHeadingBorder}"> 
       <TextBlock Text="Col 1 Row 1" Style="{DynamicResource DetailHeadingText}" /> 
      </Border> 
       <TextBlock Text="{Binding IsReason, ElementName=ChangeDetailRoot}" Style="{DynamicResource DetailText}" Width="{Binding ActualWidth, ElementName=FirstBorder}" /> 
      </StackPanel> 

    <StackPanel Grid.Row="1"> 
      <Border Style="{DynamicResource DetailHeadingBorder}"> 
      <TextBlock Text="Col 1 Row 2" Style="{DynamicResource DetailHeadingText}" /> 
      </Border> 
     <TextBlock Text="{Binding WasReason, ElementName=ChangeDetailRoot}" Style="{DynamicResource DetailText}" Width="{Binding ActualWidth, ElementName=FirstBorder}" /> 
    </StackPanel> 
    </Grid> 
    </Border> 
</Grid> 

모두 잘 크기를 조정합니다. 너비가 줄어들면 문제가 분명해진다. 갑자기 최대화에서 원래 크기로 이동하면 모든 열이 지정된 크기로 "춤"됩니다. 이것이 의미하는 바는 각 열의 크기를 줄이면 작은 크기로 다시 비례 적으로 크기가 조정됨을 볼 수 있다는 것입니다. 내가 발견 한 바로는 각각의 TextBlock에 직접

Width="{Binding ActualWidth, ElementName=FirstBorder}" 

이 발생했기 때문입니다. 이 문제는 한 번에 더 많은 컨트롤이 화면에 표시 될 때 눈에 띄게 악화됩니다. 그러나이 줄이 없으면 각 TextBlock 내부의 텍스트가 오른쪽으로 계속 커지면서 열에 줄 바꿈하지 않고 더 많은 텍스트가 추가됩니다.

달성하려는 목표를 달성하는 더 좋은 방법이 있습니까? HTML/CSS를 사용하면 매우 간단하게 수행 할 수 있습니다. 인터넷 검색 및이 질문에 대한 답변 stackoverflow 통해 찾고 시간을 보냈습니다.

나는 HTML/CSS의 무거운 배경에서 왔기 때문에 이것이 WPF가 잘되어야하는 것이 아니라면 알려 주시기 바랍니다.

+0

을 주제 가야하지,하지만 당신은 어디에서 찾았어요 그 아이콘들? 그들은 좋아 보인다. – FryGuy

+1

http://famfamfam.com/lab/icons/silk/ Oxite 사이트를 탐색하면서 찾았습니다. http://www.visitmix.com/Lab/Oxite –

+0

이것은 저에게 효과적입니다. 내 업데이트를 참조하십시오. – exclsr

답변

1

나는 내 자신의 질문에 답하는 것을 싫어하지만 내가 잘못하고있는 것을 발견했을 수도 있습니다. 원래의 질문이 나온 지 오래 되었기 때문에 내가 시도한 모든 단계를 기억할 수는 없지만 이것이 내가 알고있는 것입니다. 각 된 본체의 스타일과 같은 설정 : 그 당시

<Style x:Key="DetailText" TargetType="TextBlock"> 
    <Setter Property="HorizontalAlignment" Value="Center" /> 
    <Setter Property="TextWrapping" Value="Wrap" /> 
    <Setter Property="TextAlignment" Value="Center" /> 
    <Setter Property="Margin" Value="5,5,5,5" /> 
</Style> 

, 나는 내가 컬럼의로 된 본체의 폭을 결합했다 그 때문에 원하는 결과를하지 않고 있으리라 믿고있어. 오늘 장난, 나는 다음과 같은 (다른 HorizontalAlignment로주의) 제거 바인딩에 스타일을 변경하고 내 문제가 해결되었다는 것을 발견 :

<Style x:Key="DetailText" TargetType="TextBlock"> 
    <Setter Property="HorizontalAlignment" Value="Stretch" /> 
    <Setter Property="TextWrapping" Value="Wrap" /> 
    <Setter Property="TextAlignment" Value="Center" /> 
    <Setter Property="Margin" Value="5,5,5,5" /> 
</Style> 
0

시도해 보니 사과 드리지 만, TextBlock.TextWrapping을 "포장"으로 설정하면 목표를 달성하지 못합니까?

그리드가 크기 조정을 처리하기 때문에 너가하고있는 너비의 물건에 대한 필요성을 없앨 수있을 것 같아.

[업데이트]

I : (이 축소과 같이 그리드 컨트롤을 누워있다, 폭 바인딩이 춤을 초래, 약간 크기를 변화 즉 지금의 일이 일어나고 아마.) 당신이보고있는 행동을 복제하려고했지만, 그것은 나를 위해 잘 작동합니다. 그래서 같은 TextBlocks에 대한 간단한 스타일을 만들어 :

<Style x:Key="DetailText" TargetType="{x:Type TextBlock}"> 
    <Setter Property="TextBlock.TextWrapping" Value="Wrap"/>     
</Style> 

그리고 다른 동적 자원 (DetailHeadingBorder, DetailHeadingText, or ColumnBorderBrush) 중 하나를 없었기 때문에 모든 블랙 (미세) 흰색이었다.

어쩌면 당신은 정말로 오래된 그래픽 카드를 가지고 있으며 소프트웨어로 렌더링하고 있을까요? 또는 귀하의 styles과 관련이 있습니다.

+0

XAML과 함께 스타일을 포함해야한다고 생각합니다.하지만 그 일을하고 있습니다. 켜져 있어도 텍스트 블록에 너비가 설정되어 있지 않으면 텍스트가 줄 바꿈되지 않습니다. –

0

질문을 잘못 해석하지는 않았지만 TextBlock.Width를 바인딩 할 필요가 없습니까?

이 XAML이 제대로 작동하는 것 같다 :

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition MinWidth="270" 
          Width="2*" /> 
     <ColumnDefinition MinWidth="160" 
          Width="*" /> 
     <ColumnDefinition MinWidth="160" 
          Width="*" /> 
     <ColumnDefinition MinWidth="160" 
          Width="*" /> 
    </Grid.ColumnDefinitions> 
    <!--  We bind the width of the textblock to the width of this border to make sure things resize correctly.  
      It's important that the margin be set to 1 larger than the margin of the textblock or else you'll end 
      up in an infinate loop  --> 
    <Border Grid.Column="0" 
      BorderThickness="0,0,1,0"> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="*" /> 
       <RowDefinition Height="*" /> 
      </Grid.RowDefinitions> 
      <StackPanel Grid.Row="0"> 
       <Border> 
       <TextBlock Text="Col 1 Row 1" /> 
       </Border> 
       <TextBlock TextWrapping="Wrap" 
         Text="gfege dfh lh dfl dhliöslghklj h lglsdg fklghglfg flg lgheh" /> 
      </StackPanel> 
      <StackPanel Grid.Row="1"> 
       <Border> 
       <TextBlock Text="Col 1 Row 2" /> 
       </Border> 
       <TextBlock Text="Massor av text som blir en wrappning i slutändan hoppas jag" 
         TextWrapping="Wrap" /> 
      </StackPanel> 
     </Grid> 
    </Border> 
    </Grid> 

난 그냥, 폭 바인딩을 제거 TextWrapping을 (당신은 아마 스타일에 있던) 추가,뿐만 아니라 "FirstBorder"라는 국경을 제거했습니다.

관련 문제