WPF时间轴

太过爱你忘了你带给我的痛 2022-03-29 10:56 478阅读 0赞

首先时间轴使用slider控件，得到如图效果

![时间轴][20190108141717895.png]

代码如下：

<Grid    Grid.Row="2">
                <StackPanel VerticalAlignment="Center" Margin="10">
                    <Slider x:Name="SliderName" Maximum="16" TickPlacement="TopLeft" TickFrequency="1" IsSnapToTickEnabled="True"  ValueChanged="Slider_ValueChanged"  IsMoveToPointEnabled="True"  /> 
                </StackPanel>
            </Grid>

后台可以操作这个Slider\_ValueChanged事件，这样就会产生拖动效果。

private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
            {	
                Date showTime=null;
                string sliderValue = (this.SliderName.Value+7).ToString();
    			//将时间改为字符串类型
                if (this.SliderName.Value < 3)
                {
                    dateStr = dateStr + " 0" + sliderValue + ":00:00";
                }
                else
                {
                    dateStr = dateStr + " " + sliderValue + ":00:00";
                }
                showTime = Convert.ToDateTime(dateStr);
    			//这个方法内负责查询
               QueryData(showTime);   
            }

[20190108141717895.png]: /images/20220329/bd7707838a1f4252a660e57075834034.png

发表评论取消回复

表情：

评论列表（有 0 条评论，478人围观）

还没有评论，来说两句吧...

相关阅读

相关 Flutter时间轴

一，真实点,直接上图吧。 [github地址][github] [视频教学地址][Link 1] ![在这里插入图片描述][watermark_type_ZmFu

墨蓝/ 2022年12月24日 10:48/ 0 赞/ 168 阅读

相关 CSS 时间轴样式效果

效果预览 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0

亦凉/ 2022年08月29日 05:45/ 0 赞/ 304 阅读

相关 Android 时间轴的实现

时间轴时间轴，顾名思义就是将发生的事件按照时间顺序罗列起来，给用户带来一种更加直观的体验。京东和淘宝的物流顺序就是一个时间轴（如图），想必大家都不陌生。 ![京东物流

客官°小女子只卖身不卖艺/ 2022年08月21日 04:17/ 0 赞/ 237 阅读

相关 Long型时间轴时间类型转为正常格式时间

/ 转换时间start / Date.prototype.format = function (format) { var o = {

旧城等待，/ 2022年06月18日 11:48/ 0 赞/ 240 阅读

相关 iOS 物流信息时间轴

> 代码地址如下： > [http://www.demodashi.com/demo/11958.html][http_www.demodashi.com_demo_119

拼搏现实的明天。/ 2022年05月29日 00:20/ 0 赞/ 285 阅读

相关 vue 时间轴：效果图

时间轴：效果图 ![70][] 代码： <!DOCTYPE HTML> <html> <head> <meta charset="utf-

梦里梦外;/ 2022年05月17日 07:22/ 0 赞/ 366 阅读

相关 LayaAir 时间轴动画

目录时间轴动画·概述动画编辑器时间轴动画·运用入门平移动画多时间轴动画帧动画 -------------------- 时间轴动画·概述 1、

待我称王封你为后i/ 2022年04月03日 02:52/ 0 赞/ 326 阅读

相关 WPF时间轴

首先时间轴使用slider控件，得到如图效果 ![时间轴][20190108141717895.png] 代码如下： <Grid Grid.Row="2">

太过爱你忘了你带给我的痛/ 2022年03月29日 10:56/ 0 赞/ 479 阅读

相关 html5实现横向时间轴

效果展示： ![20190628090134127.png][] [20190628090134127.png]: /images/20211220/7b2d75d

朱雀/ 2021年12月20日 14:17/ 0 赞/ 1549 阅读

相关 AngularJs 定时器/时间轴服务

时间轴服务 1、NG中也能写js语法,因为输入js范围 2、使用时需要在控制器脚本中注入 3、注入服务参数可以有多个

心已赠人/ 2021年07月24日 22:54/ 0 赞/ 401 阅读