2011-03-20 175 views
2

嘿,大家好,我一直在玩WPF的Path形狀,但我有點惱怒一些行爲。 具體來說,路徑並不像我想的那樣大小。如果你看下面的圖片,我想要的是整個路徑在白色方塊內(代表路徑控制的邊界),但弧線稍微偏離一點。我認爲這是因爲路徑根據用於繪製形狀的點而不是根據實際繪製的形狀來確定其大小。WPF路徑大小問題

我的問題是:有誰知道如何克服這個問題?我的意思是,除了明確設定路徑的尺寸之外。是否有一些選項可以忽略,以便根據形狀獲得自己尺寸的路徑,而不是根據用於製作形狀的點?感謝任何答案。

My path problem with data bindingsMy path problem with mini-language


這裏是(應該是什麼),相當於碼兩種版本:

1)首先,使用數據綁定(在一個非常詳細地寫出來):

<UserControl x:Class="OrbitTrapWpf.LineSegmentTool" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:local="clr-namespace:OrbitTrapWpf" 
     mc:Ignorable="d" 
     d:DesignHeight="300" d:DesignWidth="300" 
     x:Name="Root" Background="White"> 
<UserControl.Resources> 
    <local:ArcSizeConverter x:Key="ArcSizeConverter"/> 
    <local:ArcPointConverter x:Key="ArcPointConverter"/> 
</UserControl.Resources> 
<Path Name="path" Stroke="Black"> 
    <Path.Data> 
    <PathGeometry> 
     <PathGeometry.Figures> 
     <PathFigureCollection> 
      <PathFigure IsClosed="True"> 
      <PathFigure.StartPoint> 
       <Binding ElementName="Root" Path="point0"></Binding> 
      </PathFigure.StartPoint> 
      <PathFigure.Segments> 
       <PathSegmentCollection> 
       <ArcSegment SweepDirection="Counterclockwise" > 
        <ArcSegment.Size> 
        <Binding ElementName="Root" Path="Radius" Converter="{StaticResource ArcSizeConverter}"/> 
        </ArcSegment.Size> 
        <ArcSegment.Point> 
        <Binding ElementName="Root" Path="point1" /> 
        </ArcSegment.Point> 
       </ArcSegment> 
       <LineSegment> 
        <LineSegment.Point> 
        <Binding ElementName="Root" Path="point2" /> 
        </LineSegment.Point> 
       </LineSegment> 
       <ArcSegment SweepDirection="Counterclockwise"> 
        <ArcSegment.Size> 
        <Binding ElementName="Root" Path="Radius" Converter="{StaticResource ArcSizeConverter}"/> 
        </ArcSegment.Size> 
        <ArcSegment.Point> 
        <Binding ElementName="Root" Path="point3" /> 
        </ArcSegment.Point> 
       </ArcSegment> 
       </PathSegmentCollection> 
      </PathFigure.Segments> 
      </PathFigure> 
     </PathFigureCollection> 
     </PathGeometry.Figures> 
    </PathGeometry> 
    </Path.Data> 
</Path> 

2)而這一個,使用迷你語言:

<UserControl x:Class="OrbitTrapWpf.LineSegmentTool" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:local="clr-namespace:OrbitTrapWpf" 
     mc:Ignorable="d" 
     d:DesignHeight="300" d:DesignWidth="300" 
     x:Name="Root" Background="White"> 
<UserControl.Resources> 
    <local:ArcSizeConverter x:Key="ArcSizeConverter"/> 
    <local:ArcPointConverter x:Key="ArcPointConverter"/> 
</UserControl.Resources> 
    <Grid Name="grid"> 
    <Path Name="path" Stroke="Black" Data="M 0.146446609406726,1.14644660940673 A 0.5,0.5 0 1 0 0.853553390593274,1.85355339059327 L 1.85355339059327,0.853553390593274 A 0.5,0.5 0 1 0 1.14644660940673,0.146446609406726 Z " /> 

我認爲兩者應該大致相同,但顯然迷你版的尺寸幾乎是正確的,而原來的差別很大。

回答

2

好的,所以我找到了問題並解決了它。我已經在迷你語言版本中設置了IsLargeArc標誌,而在純粹的XAML版本中,我將其留作False。所以我把它改成True,我神奇地得到了我預期的結果。

這對我來說似乎是一個錯誤,因爲在這種情況下,大弧和小弧是同一個,因爲我畫的是半弧。如果有人知道這種行爲的原因,聽到它會是真棒!

3

基本上,你的路徑XAML說的話,就是:

  1. 開始在Point0,劃出一道弧線,以點1。
  2. 從Point1開始,畫一條線到Point2。
  3. 從Point2向第3個點繪製一條圓弧。
  4. 'IsClosed'從Point3到Point0繪製另一條線。

enter image description here

你定義究竟是什麼正在生產什麼 - 你可以改變它的唯一方法是改變你的位置 - 但電弧仍然會超越Point0延長X軸,因爲這是你已經定義了什麼。

如果你需要你的形狀完全適合某個邊界,你可以在你的形狀周圍放置一個邊界,邊界爲1/2半徑(我確定有一個確切的突起公式)在底部和右側。

由於第二張截圖與第一張截圖看起來不同,因此我會斷定它們是不同的形狀 - 這隻能表示路徑數據翻譯不正確。

+0

這是什麼做我也推斷第一個樣本。但是,當我使用迷你語言時,它的工作方式不同。在那種情況下,它確實是有限的(幾乎)完美。 – 2011-03-20 23:37:09

+0

第二個例子的路徑數據來自哪裏? – 2011-03-20 23:39:12

+0

第一個示例從數據綁定中獲取其數據,並且我手動檢索了該數據並將其插入到第二個示例中的數據字符串中。 – 2011-03-20 23:41:33

1

我跑過這篇文章,並認爲如果有人正在尋找一種簡單的方法來調整路徑或圖標的大小,我會發佈一個答案。我發現的最簡單的方法是對所有路徑顯示使用Viewbox。這是因爲路徑會在Viewbox內很好地縮放。我使用Canvas來保存每條路徑,如果您想要使用「Nice」數字,則此Canvas的大小非常重要。

這裏是如何做到這樣的例子:

首先(可選)繪製的形狀在矢量程序像Inkscape或CorelDraw中!我使用CorelDraw創建了.svg File注意:當使用程序創建矢量時,使頁面大小與100 X 100像素類似,這是您要將「畫布大小」設置爲的內容。如果您正在手動編寫路徑,這也是一個非常方便的方法,只需選取100 X 100的大小,並且所有路徑度量值都可以用作換算的換算值。

接下來使用翻譯程序如Vector to Xaml Converter並生成路徑。將其保存到資源字典中,或將其放入需要的文件中。將路徑放入畫布中,如下所示:

<Canvas x:Key="someName" Width="100" Height="100"> 
    <Path Fill="#FF000000" Stroke="#FF373435" StrokeThickness="1" Data="M92,8L92,8C103,18,103,35,92,45L45,92C35,103,18,103,8,92L8,92C-3,82,-3,65,8,55L55,8C65,-3,82,-3,92,8z"/> 
</Canvas> 

再次注意畫布的大小,它應該與「繪圖板」的尺寸相匹配。

然後使用這個只是把ContentControl中所需的路徑在像這樣顯示的寬度爲一視框和高度的內部:

<Viewbox x:Name="btnClose" Width="30" Height="30"> 
    <ContentControl Content="{StaticResource someName}" /> 
</Viewbox> 

完蛋了!關於使用路徑的另一個好處是您可以綁定背景(填充)或前景(筆畫)的顏色。以我們的例子在這裏是如何控制顏色:

<SolidColorBrush x:Key="stForeColor" Color="#FFD4D7EA" /> 

<Canvas x:Key="someName" Width="100" Height="100"> 
    <Path Fill="{StaticResource stForeColor}" Stroke="Transparent" StrokeThickness="1" Data="M92,8L92,8C103,18,103,35,92,45L45,92C35,103,18,103,8,92L8,92C-3,82,-3,65,8,55L55,8C65,-3,82,-3,92,8z"/> 
</Canvas> 

還有噸的其他東西,你可以做,什麼可以與任何其他形狀,效果,動畫等