WPF 实现温度计

0c77d988164651a661c04a9d2006e76d.png

WPF开发者QQ群: 340500857  | 微信群 -> 进入公众号主页 加入组织

  在WPF中没有现成的温度计控件,所以我们自己实现一个。

  微信群人数太多入群请添加小编微信号

(yanjinhuawechat)或(W_Feng_aiQ)入群

(需备注WPF开发者

PS:有更好的方式欢迎推荐。

01

代码如下

一、创建 Thermometer.cs 继承 Control代码如下。

96e524624b0358054c1293b30b44d031.png

using System;
using System.Globalization;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;namespace WPFDevelopers.Controls
{public class Thermometer: Control{public static readonly DependencyProperty MaxValueProperty = DependencyProperty.Register("MaxValue", typeof(double), typeof(Thermometer), new UIPropertyMetadata(40.0));public double MaxValue{get { return (double)GetValue(MaxValueProperty); }set { SetValue(MaxValueProperty, value); }}public static readonly DependencyProperty MinValueProperty = DependencyProperty.Register("MinValue", typeof(double), typeof(Thermometer), new UIPropertyMetadata(-10.0));public double MinValue{get { return (double)GetValue(MinValueProperty); }set { SetValue(MinValueProperty, value); }}/// <summary>/// 当前值/// </summary>public static readonly DependencyProperty CurrentValueProperty = DependencyProperty.Register("CurrentValue", typeof(double), typeof(Thermometer), new UIPropertyMetadata(OnCurrentValueChanged));private static void OnCurrentValueChanged(DependencyObject d, DependencyPropertyChangedEventArgs e){Thermometer thermometer = d as Thermometer;thermometer.CurrentValue = Convert.ToDouble(e.NewValue);}public double CurrentValue{get { return (double)GetValue(CurrentValueProperty); }set{SetValue(CurrentValueProperty, value);PaintPath();}}/// <summary>/// 步长/// </summary>public static readonly DependencyProperty IntervalProperty = DependencyProperty.Register("Interval", typeof(double), typeof(Thermometer), new UIPropertyMetadata(10.0));public double Interval{get { return (double)GetValue(IntervalProperty); }set { SetValue(IntervalProperty, value); }}/// <summary>/// 当前值的图形坐标点/// </summary>public static readonly DependencyProperty CurrentGeometryProperty = DependencyProperty.Register("CurrentGeometry", typeof(Geometry), typeof(Thermometer), new PropertyMetadata(Geometry.Parse(@"M 2 132.8a 4 4 0 0 1 4 -4h 18a 4 4 0 0 1 4 4v 32.2a 4 4 0 0 1 -4 4h -18a 4 4 0 0 1 -4 -4 z")));public Geometry CurrentGeometry{get { return (Geometry)GetValue(CurrentGeometryProperty); }set { SetValue(CurrentGeometryProperty, value); }}/// <summary>/// 构造函数/// </summary>static Thermometer(){DefaultStyleKeyProperty.OverrideMetadata(typeof(Thermometer), new FrameworkPropertyMetadata(typeof(Thermometer)));}public override void OnApplyTemplate(){base.OnApplyTemplate();PaintPath();}protected override void OnRender(DrawingContext drawingContext){SolidColorBrush brush = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#82848A"));Rect rect = new Rect();rect.Width = 30;rect.Height = 169;drawingContext.DrawRoundedRectangle(Brushes.Transparent,new Pen(brush, 2d),rect, 8d, 8d);#region 华氏温度drawingContext.DrawText(GetFormattedText("华"), new Point(-49, 115));drawingContext.DrawText(GetFormattedText("氏"), new Point(-49, 115 + 14));drawingContext.DrawText(GetFormattedText("温"), new Point(-49, 115 + 28));drawingContext.DrawText(GetFormattedText("度"), new Point(-49, 115 + 42));#endregion#region 摄氏温度drawingContext.DrawText(GetFormattedText("摄", FlowDirection.LeftToRight), new Point(75, 115));drawingContext.DrawText(GetFormattedText("氏", FlowDirection.LeftToRight), new Point(75, 115 + 14));drawingContext.DrawText(GetFormattedText("温", FlowDirection.LeftToRight), new Point(75, 115 + 28));drawingContext.DrawText(GetFormattedText("度", FlowDirection.LeftToRight), new Point(75, 115 + 42));#endregion#region 画刻度var total_Value = MaxValue - MinValue;var cnt = total_Value / Interval;var one_value = 161d / cnt;for (int i = 0; i <= cnt; i++){var formattedText = GetFormattedText($"{MaxValue - (i * Interval)}", FlowDirection.LeftToRight);drawingContext.DrawText(formattedText, new Point(43, i * one_value - (formattedText.Height / 2d)));//减去字体高度的一半formattedText = GetFormattedText($"{(MaxValue - (i * Interval)) * 1.8d + 32d}");drawingContext.DrawText(formattedText, new Point(-13, i * one_value - (formattedText.Height / 2d)));if (i != 0 && i != 5){drawingContext.DrawLine(new Pen(Brushes.Black, 1d),new Point(4, i * one_value), new Point(6, i * one_value));drawingContext.DrawLine(new Pen(Brushes.Black, 1d),new Point(24, i * one_value), new Point(26, i * one_value));}}#endregion}private FormattedText GetFormattedText(string text, FlowDirection flowDirection = FlowDirection.RightToLeft){return new FormattedText(text,CultureInfo.CurrentUICulture,flowDirection,new Typeface("Microsoft YaHei"),14d,new SolidColorBrush((Color)ColorConverter.ConvertFromString("#82848A")));}/// <summary>/// 动态计算当前值图形坐标点/// </summary>private void PaintPath(){var one_value = 161d / ((MaxValue - MinValue) / Interval);var width = 26d;var height = 169d - (MaxValue - CurrentValue) * (one_value / Interval);var x = 2d;var y = 169d - (169d - (MaxValue - CurrentValue) * (one_value / Interval));CurrentGeometry = Geometry.Parse($@"M 2 {y + 4}a 4 4 0 0 1 4 -4h {width - 8}a 4 4 0 0 1 4 4v {height - 8}a 4 4 0 0 1 -4 4h -{width - 8}a 4 4 0 0 1 -4 -4 z");}}
}

二、创建ThermometerExample.xaml代码如下

574352153063789b061cd43425a13fd9.png

<UserControl x:Class="WPFDevelopers.Samples.ExampleViews.ThermometerExample"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:wpfdev="https://github.com/yanjinhuagood/WPFDevelopers"xmlns:local="clr-namespace:WPFDevelopers.Samples.ExampleViews"mc:Ignorable="d" d:DesignHeight="450" d:DesignWidth="800"><Grid><Border Background="White" CornerRadius="12"Width="400" Height="400"Effect="{StaticResource NormalShadowDepth}"><Grid><Grid.ColumnDefinitions><ColumnDefinition/><ColumnDefinition/></Grid.ColumnDefinitions><Slider x:Name="PART_Slider" IsSnapToTickEnabled="True"Value="10"Minimum="-10"Maximum="40" Orientation="Vertical"Height="300"/><Grid VerticalAlignment="Center"Margin="160,0,0,0"><Path Fill="{StaticResource PrimaryMouseOverSolidColorBrush}" Stroke="{StaticResource PrimaryMouseOverSolidColorBrush}"StrokeThickness="1" Opacity=".6"Data="{Binding ElementName=PART_Thermometer, Path=CurrentGeometry,Mode=TwoWay}"/><wpfdev:Thermometer x:Name="PART_Thermometer"CurrentValue="{Binding ElementName=PART_Slider,Path=Value,Mode=TwoWay}"/></Grid><TextBlock Text="{Binding ElementName=PART_Thermometer,Path=CurrentValue,StringFormat={}{0}℃}" FontSize="24" Grid.Column="1"Foreground="{StaticResource PrimaryPressedSolidColorBrush}" FontFamily="Bahnschrift"HorizontalAlignment="Center" VerticalAlignment="Center"/></Grid></Border></Grid>
</UserControl>

02


效果预览

鸣谢素材提供者 - 帅嘉欣

源码地址如下

github:https://github.com/yanjinhuagood/WPFDevelopers.git

gitee:https://gitee.com/yanjinhua/WPFDevelopers.git

WPF开发者QQ群: 340500857 

blogs: https://www.cnblogs.com/yanjinhua

Github:https://github.com/yanjinhuagood

出处:https://www.cnblogs.com/yanjinhua

版权:本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。

转载请著名作者 出处 https://github.com/yanjinhuagood

c6ddfc5b6ceac8c5b4bc66b425c4d449.png

扫一扫关注我们,

95d00f66c8df82a21dfeb7b887fa0fc4.gif

更多知识早知道!

d5a210ac25986e794e14725d8e13adf5.gif

点击阅读原文可跳转至源代码

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/294951.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

100-6

2019独角兽企业重金招聘Python工程师标准>>> /**\第6题&#xff08;数组&#xff09;腾讯面试题&#xff1a; 给你10分钟时间&#xff0c;根据上排给出十个数&#xff0c;在其下排填出对应的十个数 要求下排每个数都是先前上排那十个数在下排出现的次数。 上排的十个…

linux系统644、755、777权限详解

在linux系统中644、755、777三种权限是非常重要的一些权限了&#xff0c;下面我来详细的介绍644、755、777三种权限的使用&#xff0c;希望对各位有帮助。常用的linux文件权限&#xff1a; 444 r--r--r-- 600 rw------- 644 rw-r--r-- 666 rw-rw-rw- 700 rwx------ 744 rwxr--r…

android获取自适应高度,Android中oncreate中获得控件高度或宽度的实现方法

Android中oncreate中获得控件高度或宽度的实现方法onCreate函数只是提供了数据初始化的机会&#xff0c;此时还没有正式绘制图形。在图形尚未渲染的情况下&#xff0c;getWidth()或getHeight()得到的值为0。如果需要自适应屏幕&#xff0c;需要一进入界面就得到父控件大小&…

单例模式7种实现

单例模式 1 、介绍&#xff1a; 单例模式(Singleton)也叫单态模式&#xff0c;是设计模式中最为简单的一种模式&#xff0c;甚至有些模式大师都不称其为模式&#xff0c;称其为一种实现技巧&#xff0c;因为设计模式讲究对象之间的关系的抽象&#xff0c;而单例模式只有自己一…

博导眼里本科生的科研能力:“他们还在玩泥巴”

父母眼中的科学博士&#xff1a;造飞机&#xff0c;造航母&#xff0c;造火箭本科生眼中的科学博士&#xff1a;特严谨&#xff0c;特专业&#xff0c;特……特别老硕士研究生眼中的博士&#xff1a;真能熬&#xff0c;真能写&#xff0c;真坚定博导眼中的博士&#xff1a;还年…

最全前端开发面试问题及答案整理

来自Github秋风的原文 说说你对闭包的理解 Talk about your understanding of closures 使用闭包主要是为了设计私有的方法和变量。闭包的优点是可以避免全局变量的污染&#xff0c;缺点是闭包会常驻内存&#xff0c;会增大内存使用量&#xff0c;使用不当很容易造成内存泄露。…

C# 10 新特性 —— 补充篇

C# 10 新特性 —— 补充篇Intro前面已经写了几篇文章介绍 C# 10 新特性的文章&#xff0c;还有一些小的更新Constant interpolated strings在之前的版本中&#xff0c;如果想要使用插值字符串来&#xff0c;则不能声明为一个常量如果依赖于一个常量的插值字符串就只能声明为一个…

线性表的基本操作

#include <stdio.h>#include <stdlib.h>#define OK 1#define ERROR 0//#define INITSIZE 5 //线性表存储空间的初始分配量//#define LISTINCREMENT 1 //线性表存储空间分配增量//实现线性表的顺序存储结构的类型定义typedef int DataType;//线性表的数据类型&#…

android技术积累,Android开发中积累的一些报错的解决方法

1.报错&#xff1a;The connection to adb is down, and a severe error has occured.[2012-03-11 09:36:56 - Camera] You must restart adb and Eclipse.[2012-03-11 09:36:56 - Camera] Please ensure that adb is correctly located at D:\SDK_1.5\platform-tools\adb.exe …

达内TTS6.0课件oop_day01

转载于:https://www.cnblogs.com/suncoolcat/p/3329114.html

过年前谈个恋爱很过分吗?

1 小盆友的广东口音有多好玩&#xff1f;&#xff08;素材来源网络&#xff0c;侵删&#xff09;▼2 今年你进步了吗&#xff1f;&#xff08;素材来源网络&#xff0c;侵删&#xff09;▼3 收到课本的丁真&#xff08;素材来源网络&#xff0c;侵删&#xff09;▼4 上海业主…

office professional 2010 key

1、Office Professional Plus 2010&#xff1a;&#xff08;VL&#xff09; MKCGC-FBXRX-BMJX6-F3Q8C-2QC6P转载于:https://blog.51cto.com/wanghao/1028409

打独立运行包遇到无法trim咋解决

背景介绍工作中我用到kotlin写代码&#xff0c;在orm上ktorm是一款非常优秀的操作db的框架&#xff0c;我喜欢用它所以我写了一个插件能够增加我的工作效率&#xff0c;这款idea插件的主体逻辑是.net开发的(没错是跨平台的.net)。因为db-schema的解析逻辑我很在以前写的一个vis…

第四周周记

随着时间的流逝&#xff0c;很快一学期都过了四分之一了 。很难想象&#xff0c;期中考又快要在耳边响起了&#xff0c;好想知道开学以来所学的内容有什么、是什么、掌握了什么&#xff0c;可惜我一点都没有回想起&#xff0c;感觉自己都不知道学了什么东西。整天拖着人壳&…

用html制作班级课程表实例,在网页制作中用表格制作一张课程表如下图。

侠客岛的含笑 Document (2013)学年第(2)学期 课程表上午一&nbsp下午三&nbsp晚上五&nbsp

Ext4.2文件目录及页面默认导入文件

一、文件结构 文件/文件夹名 作用 builds 压缩后的ExtJS代码,体积更小,更快 docs 开发文档 examples 官方演示示例 locale 多国语言资源文件 packages ExtJS各部分功能的打包文件 resource ExtJS所需要的CSS与图片文件 src 未压缩的源代码目录 bootstarp.js ExtJS库引…

打破校史!这位参与发表学校首篇Science的博士小姐姐,近日一作再发Nature

全世界只有3.14 % 的人关注了爆炸吧知识本文由科研大匠&#xff08;Id:keyandajiang&#xff09;综合整理自西南交大新闻网、官微、扬华研究生新闻中心导读&#xff1a;12月10日&#xff0c;Nature发表了西南交通大学材料科学与工程学院博士毕业生杨倩&#xff08;现为英国曼彻…

2022版Win11重磅升级!

微软宣布 Windows 11 2022 年更新将重点改进 WinUI 的性能。包括但不限于 Windows 11 文件资源管理器的启动速度、右键桌面、日期和时间弹出、音量调整、操作中心和通知中心等响应体验等。WinUI 的全称为Windows UI 库&#xff0c;是适用于 Windows 桌面应用程序和 UWP 应用程序…

Mysql Engine【innodb,myisam】

2019独角兽企业重金招聘Python工程师标准>>> Innodb,Myisam都是Mysql数据库存储的引擎&#xff0c;Innodb支持事务等数据库高级特性&#xff0c;Myisam不支持&#xff0c;但比较快速。 ISAM 是一个定义明确且历经时间考验的数据表格管理方法&#xff0c;它在设计时就…

data:text/html firefox钓鱼,JS DataURL 整理(一)

一、初识Data URL数据URL是带有前缀的URL&#xff0c;data:可以将小文件直接嵌入文档中。data URL是一种特殊格式的url&#xff0c;它的前缀是data:data URL允许内容的创建者将小文件嵌入在documents中过去被叫做data URIs&#xff0c;直到WHATWG将其更名为data URL(s)data URL…