原創|使用教程|編輯:郝浩|2013-02-17 14:23:31.000|閱讀 996 次
概述:有時候需要編寫一個在圖表文本中使用的小類,而且需要在其他的場景中也可以使用。現在來看一下如何在Chart FX for WPF中繪制可視化圓角邊框,RoundClipBorder就是這些類中的一個,它源自于邊緣,但是會使用圓形的邊界來放置內容,接下來來一起看一下一個矩形的邊框。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關鏈接:
有時候需要編寫一個在圖表文本中使用的小類,而且需要在其他的場景中也可以使用。現在來看一下如何在Chart FX for WPF中繪制可視化圓角邊框,RoundClipBorder就是這些類中的一個,它源自于邊緣,但是會使用圓形的邊界來放置內容,接下來來一起看一下一個矩形的邊框:
<Border CornerRadius="5" BorderBrush="Black" BorderThickness="2"> <Image Source="pack://siteoforigin:,,,/img/US.png"/> </Border>
如果你仔細的看,會發現在邊界的地方時比較薄的,下面來看看如果增加邊角半徑會發生什么樣的狀況呢?
從上面的圖中,顯而易見的發現,WPF繪制的圖表的內容,然后再繪制一個矩形包圍內容,但是現在發現,這個矩形進入了內容的部分,變成了一個溢出的問題,RoundClipBorder通過創建一個幾何圖形,然后切斷它的子組成部分就可以了。
<cfxControls:RoundClipBorder CornerRadius="12" BorderBrush="Black" BorderThickness="2"> <Image Source="pack://siteoforigin:,,,/img/US.png"/> </cfxControls:RoundClipBorder>
還可以將數據綁定到圖表,然后自定義圖表工具提示和顯示數據:
public class CountryData { public string Name { get; set; } public double Population { get; set; } public string Language { get; set; } public string Flag { get; set; } public double Sales { get; set;} } <Window.Resources> <ObjectDataProvider x:Key="countryData" ObjectType="{x:Type localData:CountrySalesList}" /> </Window.Resources> <Grid> <ChartFX:Chart> </ChartFX:Chart> </Grid>
第一步:將圖表綁定到頁面中對象數據提供應用程序,然后再選擇區域用于繪制和標簽,在這里可以啟動圖表創建導航來選擇配置數據。
第二步:配置圖表提示工具用于顯示來自選定項目中的其他的數據,在導航中,我們現在選擇導航,在導航工具顯示的配置頁面中選擇了所有的可用區域。
第三步:選擇Flag作為圖像區域,為了達到最后的效果,選擇了圓形剪切。
第四步:單擊完成,運行應用程序就會出現如下所示的圖表和提示:
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉載自:慧都控件