WPF 氣泡尖角在左邊、下面、右邊、上面


由於項目需要,在弄一個氣泡提示框,根據網上資料,使用Path可以將氣泡畫出來,下面是我畫出來的。

1、氣泡尖角在左邊的:

  

 <Path Stroke="Black" StrokeThickness="0.1" Fill="Yellow" HorizontalAlignment="Right">
            <Path.Data>
                <PathGeometry Figures="
                                      M 10,10 
                                      L 10,10 200,10 
                                      L 200,10 200,100 
                                      L 200,100 10,100
                                      L 10,40 -10,30
                                      L -10,30 10,30
                                      Z"/>
            </Path.Data>
        </Path>
View Code

 

2、氣泡尖角在下面的:

  

<Path Stroke="Black" StrokeThickness="0.1" Fill="Yellow">
            <Path.Data>
                <PathGeometry Figures="
                                      M 10,10 
                                      L 10,10 200,10 
                                      L 200,10 200,100 
 
                                      L 200,100 40,100  
                              
                                      L 40,100  30,110
                                      L 30,110 30,100 
                                      L 30,100 10,100 
                                      Z"/>
            </Path.Data>
        </Path>
View Code

 

3、氣泡尖角在右邊

  

 <Path Stroke="Black" StrokeThickness="0.1" Fill="Yellow" HorizontalAlignment="Left" VerticalAlignment="Bottom" Margin="10,0,0,59.339">
            <Path.Data>
                <PathGeometry Figures="
                                      M 10,10 
                                      L 10,10 200,10 
                                      L 200,10 200,80
                                      L 200,80 210,80
                                      L 210,80 200,90
                                      L 200,100 10,100
                                      Z"/>
            </Path.Data>
        </Path>
View Code

 

4、氣泡尖角在上面

 

<Path Stroke="Black" StrokeThickness="0.1" Fill="Yellow" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="10,0,0,59.339">
            <Path.Data>
                <PathGeometry Figures="
                                      M 10,10 
                                      L 10,10 180,10 
                                      L 180,10 190,0
                                      L 190,0 190,10
                                      L 190,10,200,10
                                      L 200,100 10,100
                                      
                                      Z"/>
            </Path.Data>
        </Path>
View Code

 

最后的效果顯示:

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM