Wie kann ich wie eine Karikatur Blase mit konstanten Ecken

Question

ich mit Text nach innen, wie eine Karikatur Sprechblase ein Rechteck Blase mit abgerundeten Ecken erstellen muß ein benutzerdefiniertes WPF-Steuerelement erstellen. Ich brauche die Blase, um horizontal und vertikal zu expandieren, abhängig von der Größe des darin enthaltenen Textes. Ich möchte, dass der Sprachpfeil und der Radius der abgerundeten Ecken konstant bleiben.

ich einfach einen Weg benutzen konnte meine Blase zu schaffen, aber ich kann die Blase die Größe und die Ecken Radius halten Pfeil und konstant ... es ist der ganze Weg, der Größe verändert werden.

Ich würde schätzen, dass jemand mich in die richtige Richtung zeigen könnte.

entfernt tot Images Link

Hier ist die letzte Version der Zeichentrick Blase Benutzerkontrolle. Ich habe der Version von Jobi Joy ein Rechteck ohne Strich hinzugefügt, um das Ende der Pfadlinien zu verbergen, anstatt zu versuchen, es dann bündig mit dem Rechteck erscheinen zu lassen.

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height="40"/> 
    </Grid.RowDefinitions> 
    <Rectangle Fill="#FF686868" Stroke="#FF000000" RadiusX="10" RadiusY="10"/> 
    <Path Fill="#FF686868" Stretch="Fill" Stroke="#FF000000" HorizontalAlignment="Left" Margin="30,-5.597,0,-0.003" Width="25" Grid.Row="1" Data="M22.166642,154.45381 L29.999666,187.66699 40.791059,154.54395"/>     
    <Rectangle Fill="#FF686868" RadiusX="10" RadiusY="10" Margin="1"/> 
    <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="25" Text="Hello World" TextWrapping="Wrap"/>      
</Grid> 

Answer 1

verwenden XAML, Sie können eine PopUp oder ein Content erstellen und dieses Gitter als Steuervorlage geben kann auf sie ein einheitliches Erscheinungsbild

<Grid x:Name="grid"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height="40"/> 
    </Grid.RowDefinitions> 
    <Rectangle Fill="#FF686868" Stroke="#FF000000" RadiusX="10" RadiusY="10"/> 
    <Path Fill="#FF686868" Stretch="Fill" Stroke="#FF000000" HorizontalAlignment="Left" Margin="30,-1.6,0,0" Width="25" Grid.Row="1" 
     Data="M22.166642,154.45381 L29.999666,187.66699 40.791059,154.54395"/>   
    <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="25" Text="Hello World" TextWrapping="Wrap"/>   
</Grid> 

entfernt tot Images

I Link zu erhalten haben eine blog post on this

gemacht

Answer 2

Die abgerundeten Ecken können nur ein Border mit Corner Aliasing sein.

Die Konstante/Sprach Pfeil kann ein Weg sein, die in einem Gitter zusammen mit der Grenze positioniert ist.

Werfen Sie einen Blick auf die Steuervorlage für die GroupBox und sehen, wie die „Header“ Inhalt über die Grenze des Gruppenfelds zu schweben positioniert ist.

Sie würden das gleiche tun, außer Sie einen Pfad an der Unterseite statt der oben positionieren würde.