slider_slider wpf 事件 - CSDN
精华内容
参与话题
  • slider(滑动条)详细解读及样式

    千次阅读 2018-07-03 09:44:44
    我们先来看看slider控件组成元素。Slider控件组成:用图片自定义thumb(滑块):[html] view plaincopyprint?<Style x:Key="SliderThumbStyle" TargetType="{x:Type Thumb}">...

    我们先来看看slider控件组成元素。

    Slider控件组成:

    用图片自定义thumb(滑块)

    1. <Style x:Key="SliderThumbStyle" TargetType="{x:Type Thumb}">  
    2.             <Setter Property="SnapsToDevicePixels" Value="True" />  
    3.             <Setter Property="OverridesDefaultStyle" Value="True" />  
    4.             <Setter Property="Height" Value="133" />  
    5.             <Setter Property="Width" Value="211" />  
    6.             <Setter Property="Template">  
    7.                 <Setter.Value>  
    8.                     <ControlTemplate TargetType="{x:Type Thumb}">  
    9.                         <Rectangle>  
    10.                             <Rectangle.Fill>  
    11.                                 <ImageBrush ImageSource="Assets/thumb.png" Stretch="None"/>  
    12.                             </Rectangle.Fill>  
    13.                         </Rectangle>  
    14.                     </ControlTemplate>  
    15.                 </Setter.Value>  
    16.             </Setter>  
    17.         </Style>  

     

    RepeatButton自定义类似上述

    需要知道RepeatButton分两部分,一部分滑块是划过的区域,一部分是滑块还没滑过的区域。

     

    相关说明:

    SnapsToDevicePixels可以将此特性添加到您的根元素的true启用呈现在 UI中的像素对齐。对运行在大于 96每英寸点数 (dpi)的计算机,像素的呈现最大程度地减少抗锯齿可视化项目在一个度量单位的实线附近。

     

    如果设置OverridesDefaultStyle到控件的true,则会禁止显示主题样式提供的默认控件模板。

     

    Template获取或设置控件模板。

     

    Rectangle绘制一个矩形形状,该形状可以具有笔画和填充。

    Fill获取或设置指定形状内部绘制方式的Brush

     

    Stretch获取或设置一个Stretch枚举值,该值描述形状如何填充为它分配的空间(对于EllipseRectangle,默认Stretch行为是Fill,因为它们的整个调整大小逻辑都基于WidthHeight。将EllipseRectangle的Stretch设置为None 可以有效地使其不呈现出来。)

     

    System.Windows.Shapes提供对可在可扩展应用程序标记语言 (XAML)或代码中使用的基本形状库的访问。同时还包括Path 类,该类可以加载路径数据,以便通过对象模型或内联格式描述复合几何图形。

     

    TriggerWPF样式和模板化模型允许在 Style 内部指定触发器。从本质上讲,触发器是可以让您在某些条件(例如某个属性值变为 true或者某个事件发生时)得到满足时应用更改的对象。

     

    Track表示一个处理Thumb控件的定位和大小调整的控件基元和两个用于设置ValueRepeatButton控件。

    Orientation获取或设置Slider的方向。Vertical垂直Horizontal水平

     

    绘图相关:

    Ellipse

    绘制一个椭圆。

    Line

    在两个点之间绘制一条直线。

    Path

    绘制一系列相互连接的直线和曲线。 直线和曲线维度通过 Data 属性声明,并且可以使用 Path 特定的 mini-language 或使用对象模型来指定。

    Polygon

    绘制一个多边形,它是形成闭合形状的一系列相互连接的直接。

    Polyline

    绘制一系列相互连接的直线。

    Rectangle

    绘制一个矩形形状,该形状可以具有笔画和填充。

    Shape

    EllipsePolygonRectangle 之类的形状元素提供基类。



    Slider控件样式:

    <UserControl.Resources>
    <!--笔刷-->
            <LinearGradientBrush x:Key="SliderBackground"  StartPoint="0,0" EndPoint="0,1">
                <GradientStop Offset="0" Color="#59ccfc"/>
                <GradientStop Offset="0.5" Color="#00b3fe"/>
                <GradientStop Offset="1" Color="#59ccfc"/>
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="SliderThumb"  StartPoint="0,0" EndPoint="0,1">
                <GradientStop Offset="0" Color="#FFD9D3E8"/>
                <!--<GradientStop Offset="1" Color="#dfdfdf"/>-->
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="SliderText"  StartPoint="0,0" EndPoint="0,1">
                <GradientStop Offset="0" Color="#7cce45"/>
                <GradientStop Offset="1" Color="#4ea017"/>
            </LinearGradientBrush>
     
            <!--Slider模板-->
            <Style x:Key="Slider_RepeatButton" TargetType="RepeatButton">
                <Setter Property="Focusable" Value="false" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="RepeatButton">
                            <Border Background="{StaticResource SliderBackground}" />
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
     
            <Style x:Key="Slider_RepeatButton1" TargetType="RepeatButton">
                <Setter Property="Focusable" Value="false" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="RepeatButton">
                            <Border Background="Transparent" />
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
     
            <Style x:Key="Slider_Thumb" TargetType="Thumb">
                <Setter Property="Focusable" Value="false" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Thumb">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <Border Background="{StaticResource SliderBackground}"/>
                                <Border Grid.ColumnSpan="2" CornerRadius="4"  Background="{StaticResource SliderThumb}" Width="15">
                                    <!--<TextBlock Text="||" HorizontalAlignment="Center" VerticalAlignment="Center"/>-->
                                </Border>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
     
            <Style x:Key="Slider_CustomStyle" TargetType="Slider">
                <Setter Property="Focusable" Value="false" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Slider">
                            <Grid>
                                <!--<Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="80"/>
                                    <ColumnDefinition/>
                                    <ColumnDefinition Width="40"/>
                                </Grid.ColumnDefinitions>-->
                                <Grid.Effect>
                                    <DropShadowEffect BlurRadius="10" ShadowDepth="1" />
                                </Grid.Effect>
                                <!--<Border HorizontalAlignment="Right" BorderBrush="Gray" BorderThickness="1,1,0,1" Background="{StaticResource SliderText}" Width="80" CornerRadius="8,0,0,8"/>-->
                                <!--<Border Grid.Column="2" HorizontalAlignment="Right" BorderBrush="Gray" BorderThickness="0,1,1,1" Background="{StaticResource SliderText}" Width="40" CornerRadius="0,8,8,0"/>-->
                                <!--<TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent},Path=Tag}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="14"/>-->
                                <!--<TextBlock Grid.Column="2" Text="{Binding ElementName=PART_Track,Path=Value,StringFormat=\{0:N0\}}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="14" DataContext="{Binding}" />-->
                                <Border Grid.Column="1" BorderBrush="Gray" BorderThickness="1" CornerRadius="8,0,0,8">
                                    <Track Grid.Column="1" Name="PART_Track">
                                        <Track.DecreaseRepeatButton>
                                            <RepeatButton Style="{StaticResource Slider_RepeatButton}"
                                    Command="Slider.DecreaseLarge"/>
                                        </Track.DecreaseRepeatButton>
                                        <Track.IncreaseRepeatButton>
                                            <RepeatButton Style="{StaticResource Slider_RepeatButton1}"
                                    Command="Slider.IncreaseLarge"/>
                                        </Track.IncreaseRepeatButton>
                                        <Track.Thumb>
                                            <Thumb Style="{StaticResource Slider_Thumb}"/>
                                        </Track.Thumb>
                                    </Track>
                                </Border>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
    </UserControl.Resources>




    展开全文
  • slider组件

    2019-07-16 17:19:03
    slider组件,是一个强大的滑动选择器组件;  属性:  min:类型 数字 滑动选择器的(范围)最小值  max:类型 数字 滑动选择器的(范围)最大值  step:类型 数字 步长(滑一次走的距离) 取值必须...

      slider组件,是一个强大的滑动选择器组件;

        属性:

          min:类型  数字  滑动选择器的(范围)最小值

          max:类型  数字  滑动选择器的(范围)最大值

          step:类型  数字  步长(滑一次走的距离)  取值必须大于0且必须(max-min)整除

          disabled:类型  布尔  是否禁用

          value:类型  数字  当前取值;

          active-color:类型  字符串  已选择的颜色

          background-color:类型  字符串  背景条的颜色;

          block-size:类型  数字  滑块的大小,取值范围为12-28;

          block-color:类型  数字  滑块的颜色

          show-value:类型  布尔  是否显示当前value  

        事件:

          bindchange:完成一次拖动后触发的事件

          bindchanging:拖动过程中触发的事件

    转载于:https://www.cnblogs.com/shangjun6/p/10932495.html

    展开全文
  • Slider的使用

    2018-04-02 21:33:20
    class HeaderViewHolder extends RecyclerView.ViewHolder { @BindView(R.id.slider) SliderLayout slider; public HeaderViewHolder(View itemView) { super(itemView); ...
        class HeaderViewHolder extends RecyclerView.ViewHolder {
            @BindView(R.id.slider)
            SliderLayout slider;
    
            public HeaderViewHolder(View itemView) {
                super(itemView);
                ButterKnife.bind(this, itemView);
    
                //给SliderLayout添加图片,数据来源于data对象
                for (int i = 0; i < data.getHead().getPromotionList().size(); i++) {
                    Promotion promotion = data.getHead().getPromotionList().get(i);
                    //TextSliderView 等同于ImageView+TextView 即能显示文本又能显示图片
                    TextSliderView textSliderView = new TextSliderView(activity);
    
                    textSliderView
                            .description(promotion.getInfo())//指定描述文本内容
                            .image(promotion.getPic())//指定需要加载图片
                            .setScaleType(BaseSliderView.ScaleType.Fit);//前景对背景填充方式  FitXY  centercrop
    
                    //将textSliderView控件添加在SliderLayout内部
                    slider.addSlider(textSliderView);
                }
                //动画效果指定
                slider.setPresetTransformer(SliderLayout.Transformer.DepthPage);//指定SliderLayout图片切换动画效果
                slider.setPresetIndicator(SliderLayout.PresetIndicators.Center_Bottom);//指定点位置
                slider.setCustomAnimation(new DescriptionAnimation());//描述文字出现动画效果
                slider.setDuration(4000);//图片翻页时长
            }
        }

    //

     <com.daimajia.slider.library.SliderLayout
            android:id="@+id/slider"
            android:layout_width="match_parent"
            android:layout_height="200dp" />

    //picasso图片异步加载框架 类似于Glide
    compile 'com.squareup.picasso:picasso:2.3.2'
    //兼容低版本sdk动画的jarcompile 'com.nineoldandroids:library:2.4.0'
    //自定义控件所在的jarcompile 'com.daimajia.slider:library:1.1.5@aar'


    展开全文
  • Slider基础知识(高手可以略过,下面更精彩) 常用来为用户提供选择范围的另一个元素是滑块。它具有一条轨道,可以用来在其上滑动以选择一个值。 (在iOS上称为UISlider),然后添加操作以处理更改。SwiftUI中使用...

    本文价值与收获

    看完本文后,您将能够作出下面的界面

    Jietu20200506-211213@2x.jpg

    在这里插入图片描述

    Slider基础知识(高手可以略过,下面更精彩)

    常用来为用户提供选择范围的另一个元素是滑块。它具有一条轨道,可以用来在其上滑动以选择一个值。 (在iOS上称为UISlider),然后添加操作以处理更改。SwiftUI中使用Slider非常简单,只需要State即可获取滑块值。

    @State var degrees = 0.0
    

    Slider基础代码

     Slider(value:self.$opacitys, in:-99...99,step:1)
     Text("\(degrees)C is \(Int(degrees * 9/5 + 32))F")
    

    代码

    import SwiftUI
    
    struct ContentView: View {
      @State var sliderValue: Double = 0.5
    
      var body: some View {
        VStack {
          Text("SliderValue: \(sliderValue)")
            .foregroundColor(Color(.random()))
          // Slider(value: $sliderValue).accentColor(.red).padding(.horizontal)
    
          SwiftUISlider(
            thumbColor: .orange,
            minTrackColor: .green,
            maxTrackColor: .red,
            value: $sliderValue
          ).padding(.horizontal)
        }
      }
    }
    
    
    
    struct ContentView_Previews: PreviewProvider {
        static var previews: some View {
            ContentView()
        }
    }
    
    
    struct SwiftUISlider: UIViewRepresentable {
    
      final class Coordinator: NSObject {
        // The class property value is a binding: It’s a reference to the SwiftUISlider
        // value, which receives a reference to a @State variable value in ContentView.
        var value: Binding<Double>
    
        // Create the binding when you initialize the Coordinator
        init(value: Binding<Double>) {
          self.value = value
        }
    
        // Create a valueChanged(_:) action
        @objc func valueChanged(_ sender: UISlider) {
          self.value.wrappedValue = Double(sender.value)
        }
      }
    
      var thumbColor: UIColor = .white
      var minTrackColor: UIColor?
      var maxTrackColor: UIColor?
    
      @Binding var value: Double
    
      func makeUIView(context: Context) -> UISlider {
        let slider = UISlider(frame: .zero)
        slider.thumbTintColor = thumbColor
        slider.minimumTrackTintColor = minTrackColor
        slider.maximumTrackTintColor = maxTrackColor
        slider.value = Float(value)
    
        slider.addTarget(
          context.coordinator,
          action: #selector(Coordinator.valueChanged(_:)),
          for: .valueChanged
        )
    
        return slider
      }
    
      func updateUIView(_ uiView: UISlider, context: Context) {
        // Coordinating data between UIView and SwiftUI view
        uiView.value = Float(self.value)
      }
    
      func makeCoordinator() -> SwiftUISlider.Coordinator {
        Coordinator(value: $value)
      }
    }
    
    #if DEBUG
    struct SwiftUISlider_Previews: PreviewProvider {
      static var previews: some View {
        SwiftUISlider(
          thumbColor: .white,
          minTrackColor: .blue,
          maxTrackColor: .green,
          value: .constant(0.5)
        )
      }
    }
    #endif
    
    
    extension CGFloat {
        static func random() -> CGFloat {
            return CGFloat(arc4random()) / CGFloat(UInt32.max)
        }
    }
    
    extension UIColor {
        static func random() -> UIColor {
            return UIColor(
               red:   .random(),
               green: .random(),
               blue:  .random(),
               alpha: 1.0
            )
        }
    }
    
    

    技术交流

    QQ:3365059189
    SwiftUI技术交流QQ群:518696470

    展开全文
  • 一个简单的slider滑块组件

    千次阅读 2019-06-15 19:02:13
    2019独角兽企业重金招聘Python工程师标准>>> ...
  • slider简介

    2017-12-22 14:05:07
    背景  YARN是HADOOP2中的通用资源管理平台,但是基于YARN开发应用,需要用户自己编写AM来处理资源申请、容错等,难度和复杂性比较大,因此YARN上运行良好的计算框架只有MapReduce、Spark、Tez等少数几个,...
  • JavaSwing_2.12: JSlider(滑块)

    万次阅读 2019-01-09 15:30:50
    JSlider,滑块。以图形方式在有界区间内通过移动滑块来选择值的组件。滑块可以显示主刻度标记以及主刻度之间的次刻度标记。刻度标记之间的值的个数由 setMajorTickSpacing(int) 和 setMinorTickSpacing(int) 来控制...
  • jquery插件系列之 - Slider滑块

    万次阅读 2012-06-25 17:49:18
    官方示例地址:http://jqueryui.com/demos/slider/      ·参数(参数名 : 参数类型 : 默认名称)  animate : Boolean : false   设置是否在拖动滑块时执行动画效果。   初始:$('.selector').slide
  • Slider安装说明

    千次阅读 2017-05-25 10:10:02
    Apache Slider目前还是Apache二级孵化项目,作为yarn的动态应用,可将已有分布式服务或者应用直接部署到YANR上,监控应用并按需调整应用资源大小; slider特性有: 允许用户在Yarn集群中按照需求创建应用 ...
  • unity 进度条制作:Slider,Scrollbar

    万次阅读 2017-08-29 09:42:47
    1.Unity UGUI基础之Slider、Scrollbar - ...Slider(滑动条):是一个主要用于形象的拖动以改变目标值的控件,他的最恰当应用是用来改变一个数值,最大值和最小值自定义,拖动滑块可在此之间改变,例如改变声音大小。
  • Slider

    2019-07-13 17:51:48
    Slider主要介绍几个属性:LargeChane,是slider移动的最大单位;Maximum是slider的最大值;Minimum是slider是最少值;Orientation和其他控年一样,是布局方向;SmallChange是slider移动的最少位;TickFrequency是...
  • slider

    2019-01-14 17:22:35
    slider 项目地址:ApendIr/slider  简介:SliderLibrary 更多:作者 提 Bug  标签:   A beautiful and also simple image slider for android! Screenshots
  • Apache Slider

    2019-06-13 20:48:38
    2019独角兽企业重金招聘Python工程师标准>>> ...
  • slider控件制作

    千次阅读 2007-03-09 14:30:00
    一.基本原理1.如果有最小刻度,该怎么处理?因为有接口setValue(n)你可以在onfinish(onend)里得得值getValue();再进行判断即可,简单的代码如下:设最小刻度值为16oSlider.onend = function () {var currentValue =...
  • <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,height=device-height"> <...g2 sl...
  • Apache Slider设计理念与基本架构

    千次阅读 2017-12-06 11:58:58
    在第1章,介绍了Slider学习环境的搭建方法,这是学习Slider需要进行的是最基本的准备工作。在这一章中,我们做将从设计理念和基本架构方面对Slider进行介绍,这也是准备工作的一部分。通过本章的介绍将会为下面几章...
  • WPF——Slider控件

    千次阅读 2014-12-30 19:10:16
    Slider控件,讲行通俗一点就是我们很常见的滑块,控件的外观上显示一系例刻度值,并存在一个可以被拖动的滑块,用户可以通过拖动滑块来控制控件的值。 如下图所示,是Windows系统的音量调节滑块。   ...
  • 这是一款在原生bootstrap slider的基础上制作效果非常炫酷的jQuery slider插件。该slider插件可以自定义slider的颜色、形状、透明度和tooltip等属性,美化的效果非常好 二、简单Demo 1.引用 2.HTML,css...
  • Slider简介

    千次阅读 2015-03-16 11:45:34
    本文将简单介绍下Apache孵化项目Slider——YARN上的通用服务部署工具:开发背景、使用现状、运行流程等
  • Flutter Slider

    千次阅读 2020-04-03 09:23:30
    属性 说明 value 控件的位置 onChanged 变化时回调 ...分为几块,比如设置为5,Slider只能滑动到5个位置 label divisions设置显示在节点上的label activeColor...
1 2 3 4 5 ... 20
收藏数 48,743
精华内容 19,497
关键字:

slider