C# フォームアプリ スワイプで画面切替

Question

スマートフォンのホームページの様に、
スワイプ(マウスのドラッグ)で画面を切り替える事が可能か知りたいです。
可能であれば、実現方法について教えて欲しいです。

スワイプと一緒にPanel1が移動し、
画面のサイズの半分以上のスワイプでPanel2に切替。
半分未満のスワイプの場合は、Panel1のままにしたい。

Windows10
Visual Studio 2019
Windowsフォームアプリ

試した事の追記。
Panel1の中に3つのパネルを配置。(Panel1から4の幅は同じで、panel1だけ少し高い)
Panel1をクリックして、離した際の場所によって、スクロールの場所を変更する様にしました。

やれていない事、知りたい事
1)スクロールバーを表示しない様にしたい。
2)HorizontalScroll.Valueの値を2行入れないと値が更新されない。
label2、3のtextを変更している部分で、1行の時では、label2、3の内容が異なる。button1の部分も1行だけだと、スクロールバーのカーソルの位置が動かない。

        private int _PreviousX;
        private int _PreviousMem;
        private int _ScrollMem;

        public Form1()
        {
            InitializeComponent();
            panel1.HorizontalScroll.Minimum = 0;
            panel1.HorizontalScroll.Maximum = panel1.Width * 3;
        }

        private void panel1_MouseDown(object sender, MouseEventArgs e)
        {
            _ScrollMem = panel1.HorizontalScroll.Value;
            panel1.Capture = true;
            _PreviousX = panel1.PointToScreen(e.Location).X;
            _PreviousMem = _PreviousX;

            label1.Text = System.Convert.ToString(_ScrollMem);
        }

        private void panel1_MouseMove(object sender, MouseEventArgs e)
        {
            int dragPos;


            if (panel1.Capture)
            {
                // ドラッグ中
                var x = panel1.PointToScreen(e.Location).X;
                dragPos = Math.Min(
                                                    Math.Max(
                                                        panel1.HorizontalScroll.Minimum,
                                                        panel1.HorizontalScroll.Value + _PreviousX - x),
                                                        panel1.HorizontalScroll.Maximum);

                panel1.HorizontalScroll.Value = dragPos;
                panel1.HorizontalScroll.Value = dragPos;
                _PreviousX = x;
            }
        }

        private void panel1_MouseUp(object sender, MouseEventArgs e)
        {
            int mouseValue;
            int dispPos;

            var xx = panel1.PointToScreen(e.Location).X;
            mouseValue = _PreviousMem - xx;

            if (Math.Abs(mouseValue) < (panel1.Width / 2))
            {
                dispPos = _ScrollMem;   // 移動量が半分以下の場合は元の位置
            }
            else if (mouseValue < 0)
            {
                dispPos = _ScrollMem - panel1.Width;
            }
            else
            {
                dispPos = _ScrollMem + panel1.Width;
            }

            dispPos = Math.Min(
                        Math.Max(
                            panel1.HorizontalScroll.Minimum,dispPos),panel1.HorizontalScroll.Maximum);

            panel1.HorizontalScroll.Value = dispPos;
            panel1.HorizontalScroll.Value = dispPos;

            label2.Text = System.Convert.ToString(dispPos);
            label3.Text = System.Convert.ToString(panel1.HorizontalScroll.Value);

            panel1.Capture = false;

        }

        private void button1_Click(object sender, EventArgs e)
        {
            panel1.HorizontalScroll.Value = panel1.Width * 1;
            panel1.HorizontalScroll.Value = panel1.Width * 1;
        }

        private void button2_Click(object sender, EventArgs e)
        {
            panel1.HorizontalScroll.Value = panel1.Width * 2;
            panel1.HorizontalScroll.Value = panel1.Width * 2;
        }
    }

Comments

[Zuishin]

可能です。自分で作らなければいけません。従って、作り方を教えても質問者が作れそうにない場合、回答がつかないのも十分考えられます。

コードを書いてくれる人の目に留まり、その人が暇なら回答がつくでしょう。

[m_rase]

情報ありがとうございます。
難易度が高い、あるいはコード量が多く時間が掛かる等であると理解しました。
過去の他の掲示板で、解決になっていない理由が分かりました。

[Zuishin]

なんと言えばいいかわかりませんが、難易度は高くありません。単に作業をやらされる気分になるだけです。

Answer 1

Panel２枚でちょっと試してみたんですが以下はどうでしょう
使い方はPanelを２枚用意して、離してやり、それぞれにMouseDown、MouseMove、MouseUpを用意するだけです。
応用すれば３枚とかも行けそうな気はします。

    public partial class Form1 : Form {
        Point mousePoint;
        int panel1X, panel2X;
        int panel1Y, panel2Y;
        public Form1() {
            InitializeComponent();
            panel1X = panel1.Location.X;
            panel2X = panel2.Location.X;
            panel1Y = panel1.Location.Y;
            panel2Y = panel2.Location.Y;
        }
        private void panel1_MouseDown(object sender, MouseEventArgs e) {
            if (e.Button != MouseButtons.Left) return;
            panel1.Capture = true;
            mousePoint = new Point(e.X, e.Y);
        }

        private void panel2_MouseDown(object sender, MouseEventArgs e) {
            if (e.Button != MouseButtons.Left) return;
            panel2.Capture = true;
            mousePoint = new Point(e.X, e.Y);
        }

        private void panel1_MouseMove(object sender, MouseEventArgs e) {
            if (panel1.Capture && e.Button == MouseButtons.Left) {
                panel1.Location = new Point(panel1.Location.X + e.X - mousePoint.X, panel1.Location.Y);
            }
        }

        private void panel2_MouseMove(object sender, MouseEventArgs e) {
            if (panel2.Capture && e.Button == MouseButtons.Left) {
                panel2.Location = new Point(panel2.Location.X + e.X - mousePoint.X, panel2.Location.Y);
            }
        }

        private void panel1_MouseUp(object sender, MouseEventArgs e) {
            panel1.Capture = false;

            int mouseValue;

            mouseValue = panel1.Location.X - panel1X;

            if (Math.Abs(mouseValue) < (panel1.Width / 2)) {
                panel1.Location = new Point(panel1X, panel1Y);
                panel2.Location = new Point(panel2X, panel2Y);
            } else if (mouseValue < 0) {
                panel1.Location = new Point(panel2X, panel2Y);
                panel2.Location = new Point(panel1X, panel1Y);
            } else {
                panel1.Location = new Point(panel1X, panel1Y);
                panel2.Location = new Point(panel2X, panel2Y);
            }
        }

        private void panel2_MouseUp(object sender, MouseEventArgs e) {
            panel1.Capture = false;

            int mouseValue;

            mouseValue = panel2.Location.X - panel1X;//panel2はpanel1の位置

            if (Math.Abs(mouseValue) < (panel2.Width / 2)) {
                panel1.Location = new Point(panel2X, panel2Y);
                panel2.Location = new Point(panel1X, panel1Y);
            } else if (mouseValue < 0) {
                panel1.Location = new Point(panel2X, panel2Y);
                panel2.Location = new Point(panel1X, panel1Y);
            } else {
                panel1.Location = new Point(panel1X, panel1Y);
                panel2.Location = new Point(panel2X, panel2Y);
            }
        }
    }

Comments

[m_rase]

回答ありがとうございます。
マウスに合わせて、panel1、2をそれぞれ移動する事ができました。

ここでPanel1のbuttonMoveをしている時にPanel2も同時に移動している様に見せたいのですが、
panel1の場所からオフセットした位置にpanel2のLocationを変更しても
選択しているパネルしか表示できませんでした。
ご存じであれば、panel1に合わせてpanel2を動いている様に表示する方法を教えて頂けないでしょうか。

[m_rase]

すみません。
もう一度、実行した所、同時に表示が移動できていました。

3枚にするなど試して見たいと思います。
回答ありがとうございました。

[Hey_CH]

頑張ってください！

Answer 2

スワイプ機能については、以前、実装したことがあるので可能です。
ただ、コードの数行でどうにかなるようなものではないので回答がないのかもしれないですね。

こういうツールがあったりします。

「TouchToolkit for WinForms」
https://www.grapecity.co.jp/developer/controls/winforms/touchtoolkit

#追記

実装しなければならない点は３つあると思います。

(1) マウスが押されたら、Panel1 の Capture を true にし、マウスが離されるまでの動きに Panel1 の位置を追従させる。

(2) マウスが離されたら、スライドさせて消すのか、元に戻すのかの判定。

マウスの動きを記録し、どのくらいの速さでスライドさせるのかの判断が難しいです。
ここを誤ると違和感のある動作になってしまいます。

(3) AnimateWindow をつかって Panel1 をスライドする.

これは以下にサンプルを書きます。
AnimateWindow の使い方についてはどこかのサイトに載っているでしょう。
ボタン１つとパネルをフォームに張り付けて、以下のコードを実行してください。
ボタンを押すと、パネルが左から右にスライドして消えます。

namespace QA257985
{
    using System;
    using System.Windows.Forms;
    using System.Runtime.InteropServices;

    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private const int
            AW_NONE = 0,
            AW_HOR_POSITIVE = 0x00000001,
            AW_HOR_NEGATIVE = 0x00000002,
            AW_VER_POSITIVE = 0x00000004,
            AW_VER_NEGATIVE = 0x00000008,
            AW_CENTER = 0x00000010,
            AW_HIDE = 0x00010000,
            AW_ACTIVATE = 0x00020000,
            AW_SLIDE = 0x00040000,
            AW_BLEND = 0x00080000;

        [DllImport("user32.dll")]
        private static extern bool AnimateWindow(IntPtr hWnd, int dwTimeMSec, int dwFlags);

        private void button1_Click(object sender, EventArgs e)
        {
            panel1.Visible = true;
            AnimateWindow(panel1.Handle, 400, AW_HIDE | AW_SLIDE | AW_HOR_POSITIVE);
            panel1.Visible = false;
        }
    }
}

Comments

[m_rase]

回答ありがとうございます。
ネットで調べていた時にそのサイトを見ました。

[m_rase]

ありがとうございます。
調べて、試させて頂きます。

[m_rase]

遅くなってしまいましたが、教えて頂いた3について表示・非表示をスライドの様に見せる事ができました。回答ありがとうございました。
1,2を行う方法を、パネル3の中に、パネル1,2を入れてスクロールする事にしました。(他の方法が思いつかなかったためです。)