C# TrackBarをクリックした時にそこに移動したい。また、ユーザーコントロールにDelegateを追加したい。

Question

実現したいこと

TrackBarでスライダーを実装し、スライダーの動きに合わせてNumericUpDownの数値を変更するようにしました。
同じコントロールを複数しようしたいため、ユーザーコントロールで実装しています。

1.現在、スクロールバーをクリックしても5ずつ移動する形となっており、その処理をクリックした位置までスライドさせるようにしたいです。

2.画像の「明るい」のコントロールのみ、値の範囲を1~2.55にし、Incrementを0.01にしたいです。（明るさなのにその範囲はおかしくない？と思うかもしれませんが、そこは考えないでください）

3.Delegateを設定し、音量や明るさを変えたときにリアルタイムで関数が呼ばれるようにしたいです。

発生している問題・分からないこと

1.調べたのですが、やり方が分かりませんでした。

2.TrackBarがint型でdouble型をいれることができませんでした。また、NumericUpDownはdecimal型でプロパティのIncrementに0.01を入れることが出来ませんでした。

3.ユーザーコントロールでTrackBarとNumericUpDownを配置しているため、スライダーを動かした時のチェンジイベントが走りません。
そのため、form1で音量と明るさを設定する関数をユーザーコントロール側でDelegateを用いて利用したいです。
正直、Delegateがよく分かっていないので、説明が下手ですみません。

該当のソースコード

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace スライダー
{
    public partial class Form1 : Form
    {
        UserControl1 UserControl1 = new UserControl1 ();
        public Form1()
        {
            InitializeComponent();
        }


        private void Form1_Load(object sender, EventArgs e)
        {
            //userControl12.NumericUpDownIncrement = 0.01;
        }

        public void Volume()
        {
            // trackbarの値を取得
            int value = userControl11.TrackBar1;
            // 変更された値をもとに音量を反映させる処理
            SetVolume(value);
        }


        public void Brightness()
        {
            // trackbarの値を取得
            int value = userControl12.TrackBar1;
            // 変更された値をもとに明るさを反映させる処理
            SetBrightness(value);
        }


        public void SetVolume(int value)
        {
　　　　// 音量を設定する処理
        }

        public void SetBrightness(int value) // 一旦iut型
        {
　　　　// 明るさを設定する処理
        }
    }
}

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace スライダー
{
    public partial class UserControl1 : UserControl
    {

        public int TrackBar1
        {
            get { return trackBar1.Value; }
        }

        public int NumericUpDownIncrement
        {
            set { numericUpDown1.Increment = value; }
        }

        public UserControl1()
        {
            InitializeComponent();
        }

        private void trackBar1_Scroll(object sender, EventArgs e)
        {
            numericUpDown1.Text = trackBar1.Value.ToString();
        }

        private void UserControl1_Load(object sender, EventArgs e)
        {
            trackBar1.ValueChanged += new EventHandler(trackBar1_Scroll);
        }

        private void numericUpDown1_ValueChanged(object sender, EventArgs e)
        {
            trackBar1.Value = (int)numericUpDown1.Value;
        }
    }
}

試したこと・調べたこと

• teratailやGoogle等で検索した
• ソースコードを自分なりに変更した
• 知人に聞いた
• その他

上記の詳細・結果

TrackBarに関する情報が少なく、有益な情報が得られませんでした。
また、Delegateについてはサンプルコードを書いてみてもよくわからなかったため、お力添えを願いたく存じます。

補足

2つの処理くらいだったらわざわざユーザーコントロールにせずチェンジイベントでDelegate使う必要もないと思う方もいるかもしれませんが、同じコントロールを増やす予定なのでユーザーコントロールとしています。

Comments

[YAmaGNZ]

以前の質問を放置しないで何かしらリアクションしましょう。

[TN8001]

質問のしっぱなしではなく、解決したなら「解決済」にしてください。
[ヘルプ｜質問を解決済みにしたい](https://teratail.com/help#resolve-question)

「回答の意味が分からない」・「回答通りにしてもできない」等、解決していないのであれば回答にコメントしてください。

回答者は質問者のスキルが分からないので、「このくらいで通じるかな？」というところで回答しますが、わからなかったら遠慮なく言ってください。
ほとんどの回答者はコメントがあれば、追加の説明も快くしてくれます。

[TN8001]

> 1.現在、スクロールバーをクリックしても5ずつ移動する形となっており、その処理をクリックした位置までスライドさせるようにしたいです。

前回の質問の回答で使用した「ColorSlider」は、お気に召さなかったでしょうか？
「ColorSlider」なら何もしないでもその動作になりますが。
NuGetの利用法が分からない感じですか？

> 2.画像の「明るい」のコントロールのみ、値の範囲を1~2.55にし、Incrementを0.01にしたいです。

「ColorSlider」ならValueやMaximum等がdecimalなので、NumericUpDownとも相性がいいです。
TrackBarでやるなら例えば「100倍して…」みたいなことになるんでしょうが、めんどくさいです^^;

> 3.Delegateを設定し、音量や明るさを変えたときにリアルタイムで関数が呼ばれるようにしたいです。

前回の質問の回答でValueChangedイベントも定義したのですが、話が通じていませんか？
それとも値を含んで通知する独自デリゲートが欲しいという意味ですか？
これも何を言っているか通じていなそうなので例が必要ですかね...

[cooo3333]

解決済みにせずすみませんでした。

NuGetの利用法については正直よくわかっていません。
もしTrackBarでの実装方法もあるならその方法を知りたいなと思いました。

独自Delegateが欲しいということで合ってると思います。
とはいえそれもよく分かっていないため、例があると非常に助かります。

[YAmaGNZ]

UserControlにMinimum、Maximum、Incrementといった必要なプロパティをdecimal型にて実装し、内部で必要な計算をするといった形になるかと思います。
またNumericUpDownにて小数部を表示するにはDecimalPlacesプロパティを設定することになります。
numericUpDown1.DecimalPlaces = 2;
numericUpDown1.Increment = (decimal)0.01;
といった感じにすればよろしいかと思います。

[cooo3333]

NuGetについてですが、使用してはいけないようでした。
そのため、TrackBarについてもクリックした時にその位置に移動する処理の方法について教えて頂きたいです。

[TN8001]

> NuGetについてですが、使用してはいけないようでした。

ん？使用するかどうかを決められる立場ではないということですか？
個人のプロダクトかと思っていたのですが、仕事あるいは課題？ということなんでしょうか。

> そのため、TrackBarについてもクリックした時にその位置に移動する処理の方法について教えて頂きたいです。

めんどくさそうなうえ車輪の再発明は大嫌いなので、わたしは撤退させていただきます。

[cooo3333]

ご丁寧にありがとうございました。

Answer 1

TrackBarでクリックした場所につまみを持ってくる場合、クリックされた座標から自分で計算することとなります。
下記のような感じでTrackBarを継承したコントロールを作成するのがいいかと思います。
下記の物はエラー処理など一切入れていないので注意してください。

中身の簡単な解説としては以下のような処理となっています。
1.SendMessageにてTrackBarのチャネル（スライダーが移動する場所）の領域を取得しておきます。
2.MouseDownイベントにてクリックされたX座標がどの値の位置なのかを計算して求めます。（CalcValueメソッド）
3.その値をValueにセットします。
4.操作による値の変化なのでScrollイベントを発生させます。

using System;
using System.Runtime.InteropServices;
using System.Windows.Forms;
using System.Drawing;

public class MyTrackBar : TrackBar
{
    private Rectangle channel;

    private struct RECT
    {
        public int left, top, right, bottom;
    }

    [DllImport("user32.dll")]
    private static extern IntPtr SendMessage(IntPtr hWnd, int msg, IntPtr wp, ref RECT lp);


    // TrackBarのチャネル（スライダーが移動する場所）の領域を取得する
    private Rectangle GetChanelRectangle()
    {
        const int TBM_GETCHANNELRECT = 0x400 + 26;
        RECT rc = new RECT();
        SendMessage(Handle, TBM_GETCHANNELRECT, IntPtr.Zero, ref rc);
        return new Rectangle(rc.left, rc.top, rc.right - rc.left, rc.bottom - rc.top);
    }

    protected override void OnHandleCreated(EventArgs e)
    {
        base.OnHandleCreated(e);
        channel = GetChanelRectangle();
    }

    protected override void OnMouseDown(MouseEventArgs e)
    {
        if(e.Button == MouseButtons.Left)
        {
            Value = CalcValue(e.X);
            base.OnScroll(EventArgs.Empty);
        }
    }

    protected override void OnMouseMove(MouseEventArgs e)
    {
        if ( e.Button == MouseButtons.Left)
        {
            Value = CalcValue(e.X);
            base.OnScroll(EventArgs.Empty);
        }
    }

    int CalcValue(int x)
    {
        int value = 0;

        if (x < channel.Left)
            value = Minimum;
        else if (x > channel.Right)
            value = Maximum;
        else
        {
            double ticWidth = channel.Width / (double)(Maximum - Minimum);
            value = (int)((x - channel.Left) / ticWidth + Minimum);
        }
        return value;
    }
}

そして、このmyTrackBarをUserControlにTrackBarの代わりに使い、TrackBarに設定する値をintに計算して使用するようにします。

using System;
using System.Windows.Forms;

public partial class UserControl1 : UserControl
{

    public decimal Maximum { 
        get => numericUpDown1.Maximum;

        set
        {
            numericUpDown1.Maximum = value;
            myTrackBar1.Maximum = numeric2trackbar(value);
        }
    }
    public decimal Minimum {
        get => numericUpDown1.Minimum;

        set
        {
            numericUpDown1.Minimum = value;
            myTrackBar1.Minimum = numeric2trackbar(value);
        }
    }

    public decimal Increment {
        get => numericUpDown1.Increment;

        set
        {
            numericUpDown1.Increment = value;
            myTrackBar1.SmallChange = numeric2trackbar(numericUpDown1.Increment);
        }
    }

    public int DecimalPlaces {
        get => numericUpDown1.DecimalPlaces;

        set
        {
            numericUpDown1.DecimalPlaces = value;
            myTrackBar1.Maximum = numeric2trackbar(numericUpDown1.Maximum);
            myTrackBar1.Minimum = numeric2trackbar(numericUpDown1.Minimum);
        }
    }

    public decimal Value {
        get => numericUpDown1.Value;

        set
        {
            numericUpDown1.Value = value;
            myTrackBar1.Value = numeric2trackbar(numericUpDown1.Value);
        }
    }


    public UserControl1()
    {
        InitializeComponent();
    }


    private void trackBar1_Scroll(object sender, EventArgs e)
    {
        numericUpDown1.Value = trackbar2numeric(myTrackBar1.Value);
    }

    private void numericUpDown1_ValueChanged(object sender, EventArgs e)
    {
        myTrackBar1.Value = numeric2trackbar(numericUpDown1.Value);
    }

    private int numeric2trackbar(decimal value)
    {
        return (int)(value * (decimal)Math.Pow(10, numericUpDown1.DecimalPlaces));
    }
    private decimal trackbar2numeric(int value)
    {
        return value / (decimal)Math.Pow(10, numericUpDown1.DecimalPlaces);
    }
}

この例はValueChangedイベント等のイベント処理は入れていません。
こちらのほうはTN8001さんの回答に書いてありますので、そちらを理解されて組み込むのがいいでしょう。

Answer 2

1.現在、スクロールバーをクリックしても5ずつ移動する形となっており、その処理をクリックした位置までスライドさせるようにしたいです。

NuGet禁止というわけではないようなので、「ColorSlider」を利用させていただきました。
NuGet Gallery | lioncs.ColorSlider 1.0.0

2.画像の「明るい」のコントロールのみ、値の範囲を1~2.55にし、Incrementを0.01にしたいです。

ColorSliderはMinimumやSmallChange等がdecimalのため、NumericUpDownとそのまま合わせられます。

3.Delegateを設定し、音量や明るさを変えたときにリアルタイムで関数が呼ばれるようにしたいです。

単純に 「値が変更された」ことだけわかるイベントで用は足りると思いますが、独自EventArgsや独自delegateも例として併記しました。
イベントの処理と発生 | Microsoft Learn

---

Form1にはUserControl1を２つ置き、各プロパティやイベントをそれぞれ設定すること。

using System;
using System.Diagnostics;
using System.Windows.Forms;

namespace Qgqwsmkt45f9hwe
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();

            // デザイナで設定済み（設置したUserControl1をダブルクリック）
            //userControl11.ValueChanged += UserControl11_ValueChanged;
            //userControl12.ValueChanged += UserControl12_ValueChanged;

            userControl11.ValueChanged2 += UserControl11_ValueChanged2;
            userControl12.ValueChanged2 += UserControl12_ValueChanged2;

            userControl11.ValueChanged3 += UserControl11_ValueChanged3;
            userControl12.ValueChanged3 += UserControl12_ValueChanged3;
        }

        private void UserControl11_ValueChanged(object sender, EventArgs e)
        {
            Debug.WriteLine($"[ValueChanged] 音量: {userControl11.Value}");
        }
        private void UserControl12_ValueChanged(object sender, EventArgs e)
        {
            Debug.WriteLine($"[ValueChanged] 明るさ: {userControl12.Value}");
        }

        private void UserControl11_ValueChanged2(object sender, ValueChanged2EventArgs e)
        {
            Debug.WriteLine($"[ValueChanged2] 音量: {e.Value}");
        }
        private void UserControl12_ValueChanged2(object sender, ValueChanged2EventArgs e)
        {
            Debug.WriteLine($"[ValueChanged2] 明るさ: {e.Value}");
        }

        private void UserControl11_ValueChanged3(decimal value)
        {
            Debug.WriteLine($"[ValueChanged3] 音量: {value}");
        }
        private void UserControl12_ValueChanged3(decimal value)
        {
            Debug.WriteLine($"[ValueChanged3] 明るさ: {value}");
        }
    }
}

UserControl1にはNumericUpDown・ColorSlider・Labelを１つずつ置き、各プロパティやイベントをそれぞれ設定すること。

using System;
using System.ComponentModel;
using System.Windows.Forms;

namespace Qgqwsmkt45f9hwe
{
    // コンポーネントの既定のイベント
    // （デザイナでコンポーネントをダブルクリックするとイベントハンドラ自動作成）
    [DefaultEvent("ValueChanged")]
    public partial class UserControl1 : UserControl
    {
        public decimal Maximum
        {
            get => numericUpDown1.Maximum;
            set
            {
                // ValueがMaximumより大きいとエラーになるので範囲内に収める
                Value = Clamp(Value, Minimum, value);

                // それぞれに設定
                colorSlider1.Maximum = numericUpDown1.Maximum = value;
            }
        }

        public decimal Minimum
        {
            get => numericUpDown1.Minimum;
            set
            {
                Value = Clamp(Value, value, Maximum);
                colorSlider1.Minimum = numericUpDown1.Minimum = value;
            }
        }

        public decimal Value
        {
            get => numericUpDown1.Value;
            set => numericUpDown1.Value = value;
        }

        public decimal Increment
        {
            get => numericUpDown1.Increment;
            set => colorSlider1.SmallChange = numericUpDown1.Increment = value;
        }

        // プロパティやイベントの説明を付けるなら、こういったものを個々に書く必要あり
        // ↓ドキュメントコメント（DecimalPlacesにマウスオーバーした時に表示されるテキスト）をNumericUpDownから借用
        /// <inheritdoc cref="NumericUpDown.DecimalPlaces"/>
        // ↓デザイナのプロパティウィンドウ中の説明
        [Description("表示する小数点以下の桁数を示します。")] 
        public int DecimalPlaces
        {
            get => numericUpDown1.DecimalPlaces;
            set => numericUpDown1.DecimalPlaces = value;
        }

        // デザイナのプロパティウィンドウにTextを出すおまじない
        [Browsable(true), Bindable(true)]
        [EditorBrowsable(EditorBrowsableState.Always)]
        [DesignerSerializationVisibility(DesignerSerializationVisibility.Visible)]
        public override string Text { get => label1.Text; set => label1.Text = value; }


        // 「値が変更された」ことがわかればいいならこう（NumericUpDownやTrackBarと同様）
        public event EventHandler ValueChanged;

        // 「値が〇〇に変更された」という数値も欲しいなら、
        // ジェネリックのEventHandler<T>で独自EventArgs付きにする
        public event EventHandler<ValueChanged2EventArgs> ValueChanged2;

        // どうしても独自delegateを使いたいならお好きにどうぞ
        public event ValueChanged3EventHandler ValueChanged3;


        public UserControl1()
        {
            InitializeComponent();

            // 相互にバインド
            numericUpDown1.DataBindings.Add(new Binding("Value", colorSlider1, "Value"));
            colorSlider1.DataBindings.Add(new Binding("Value", numericUpDown1, "Value"));

            // デザイナで設定済み
            //numericUpDown1.ValueChanged += NumericUpDown1_ValueChanged;
        }

        private void NumericUpDown1_ValueChanged(object sender, EventArgs e)
        {
            // senderがnumericUpDown1になるのはイヤなので自前で発砲
            ValueChanged?.Invoke(this, EventArgs.Empty);

            // 値をValueChanged2EventArgsにセットして発砲
            ValueChanged2?.Invoke(this, new ValueChanged2EventArgs { Value = Value });

            // 値を直に入れて発砲（delegateの定義次第）
            ValueChanged3?.Invoke(Value);
        }

        private static decimal Clamp(decimal value, decimal min, decimal max)
        {
            if (value < min) return min;
            else if (value > max) return max;
            return value;
        }
    }


    // 独自EventArgs
    public class ValueChanged2EventArgs : EventArgs
    {
        public decimal Value { get; set; }
    }

    // 独自delegate（object senderを付けてもいいし、使用側でキャスト不要になるようにUserControl1 senderとしてもいいしご自由に）
    public delegate void ValueChanged3EventHandler(decimal value);
}

Comments

[cooo3333]

回答ありがとうございます。
Delegateについてですが、いまいち理解できませんでした。
他に参考サイトなどがあれば教えていただきたいです。

[TN8001]

> Delegateについてですが、いまいち理解できませんでした。

デリゲートについて勉強したいのではなくて、UserControl1のValueChangedをForm1で使えるようにしたいという話なんですよね？
であれば
userControl11.ValueChanged += UserControl11_ValueChanged;
これで十分で特にデリゲートの出番はないですが。

まあデリゲートもそんなに難しい話ではなくて、例えば「int a = 1;」と同じようにメソッドを入れられる型です。

ValueChanged3EventHandler b = UserControl11_ValueChanged3; // 定義したデリゲート
Action<decimal> c = UserControl12_ValueChanged3; // 汎用デリゲート

今回の用途だとeventも絡むため、ちょっとややこしく見えるかもしれません。
[イベント - C# によるプログラミング入門 | ++C++; // 未確認飛行 C](https://ufcpp.net/study/csharp/sp_event.html#event-keyword)

> 他に参考サイトなどがあれば教えていただきたいです。

う～ん。特におすすめもないですが、単純に調べると「例のための例」になってしまい意図が分かりにくかったり、どう役立つか想像しにくかったりはあるかもしれません。

EventHandler<T>やAction・Funcがあるので、デリゲートを自分で定義することもそうない気はします。
定義するより使う側（Linqとかラムダ式とか）を調べたほうが有益な気がします。

[cooo3333]

回答ありがとうございます。
まだ解決は出来てませんが、再度色々と調べてみます。
ありがとうございました。

[cooo3333]

今更で申し訳ないのですが、
設置したUserControl1をダブルクリックしてもloadイベントとなり、ValueChanged2にはならないのですが、どうしたらよいでしょうか？

[TN8001]

> 設置したUserControl1をダブルクリックしてもloadイベントとなり、ValueChanged2にはならないのですが、どうしたらよいでしょうか？

一旦プロジェクトのビルド（≒実行）をしてください。

それでもダメなら下記を再確認してください。
* クラスにDefaultEventはついていますか？
[DefaultEvent("ValueChanged2")]
public partial class UserControl1 : UserControl

* ValueChanged2イベントはありますか？
public event EventHandler<ValueChanged2EventArgs> ValueChanged2;

それでもダメならプロパティウィンドウで設定してください^^;
1. Form1でUserControl1を選択
2. プロパティウィンドウを開く
3. プロパティウィンドウ上部のイベントボタン（ピカチュウのしっぽみたいなやつ）を押す
4. 該当イベントの上でダブルクリック