C# Panelでのスクロールバー制御

Question

お世話さまです。皆さまのお知恵を貸して頂きたく、お願い致します。
画面描画について教えて頂きたいと思っています。
画面描画につていは、初心者すぎてしまい、色々と調べましたがわかりませんでした。

☆環境☆
Windows10 64bit
Visual Studio2017
C# (.Net 4.7.2)

☆実現したいこと☆
Panelの内容をボタン押下、スクロールバー操作によって、スクロールさせたい。

☆質問事項☆
PanelでのAutoScrollの制御です。
フォーム上にPanelを一つとボタン２つを配置し、Panleには塗りつぶした四角形をPanelの右端から左端にかけて10個描画します。
初期表示状態ではスクロールバーも一番右端に表示するようにしておきます。
ボタン１を押すとPanelの内容とスクロールバーが右へスクロールし、ボタン２を押すとPanelの内容とスクロールバーが左へスクロールするようにしたいのですが、スクロールバーとスクロール時のPanelの再描画をどのように行ったら良いのかわかりません。
ボタンのクリックイベント内でスクロール処理を行うのでしょうか？

☆初期表示イメージ☆

☆ソースコード☆

using System;
using System.Drawing;
using System.Windows.Forms;

namespace WindowsFormsApp1
{
    public partial class Form1 : Form
    {
        int horScrollValue = 0;
        int verScrollValue = 0;

        bool isFirstTime = true;

        public Form1()
        {
            InitializeComponent();
            
        }

        private void panel1_Paint(object sender, PaintEventArgs e)
        {
            panel1.AutoScroll = true;
            panel1.AutoScrollMinSize = new Size(25 * 10, 25 * 0);

            if(isFirstTime)
            {
                panel1.HorizontalScroll.Value = HorizontalScroll.Maximum;
                isFirstTime = false;
            }
            

            Graphics g = panel1.CreateGraphics();
            g.Clear(SystemColors.Control);

            for (int i = 0; i < 10; i++)
            {
                g.FillRectangle(Brushes.DeepSkyBlue,
                    panel1.ClientSize.Width - 20 + horScrollValue - (i * 25),
                    panel1.ClientSize.Height - 20 + verScrollValue,
                    20,
                    20);
            }
        }

        private void button1_Click(object sender, EventArgs e)
        {
　　　　　　　// 右へスクロールする処理を記述
        }

        private void button2_Click(object sender, EventArgs e)
        {
            // 左へスクロールする処理を記述
        }
    }
}

Comments

[Zuishin]

スクロールバーにもボタンがついているので UI としては過剰になりますが、この仕様でいくのですか？ であれば、panel の HorizontalScroll.Value を計算してセットしてください。
https://docs.microsoft.com/ja-jp/dotnet/api/system.windows.forms.scrollablecontrol.horizontalscroll?view=netframework-4.8

Answer 1

Panel の中に Panel を入れると楽かと思います。

using System;
using System.Drawing;
using System.Windows.Forms;

namespace WindowsFormsApp1
{
    public partial class Form1 : Form
    {
        public Form1() {
            InitializeComponent();
            panel1.AutoScroll = true;
            var cz = panel1.ClientSize;
            var internalPanel = new Panel();
            internalPanel.Location = new Point(0, 0);
            internalPanel.Size = new Size(cz.Width * 2, 
                cz.Height - SystemInformation.HorizontalScrollBarHeight);
            internalPanel.Paint += internalPanel_Paint;
            panel1.Controls.Add(internalPanel);
        }

        protected override void OnLoad(EventArgs e) {
            base.OnLoad(e);
            panel1.HorizontalScroll.Value = panel1.HorizontalScroll.Maximum;
        }

        private void internalPanel_Paint(object sender, PaintEventArgs e) {
            var con = (Control)sender;
            Graphics g = e.Graphics;
            g.Clear(SystemColors.Control);
            for (int left = 0; left < con.ClientSize.Width; left += 25) {
                g.FillRectangle(Brushes.DeepSkyBlue,
                    left,
                    con.ClientSize.Height - 20,
                    20,
                    20);
            }
        }

        private void Button1_Click(object sender, EventArgs e) {
            SetHScoll(-1);
        }

        private void Button2_Click(object sender, EventArgs e) {
            SetHScoll(+1);
        }

        private void SetHScoll(int scollValue) {
            var hbar = panel1.HorizontalScroll;
            int value = hbar.Value + hbar.SmallChange * scollValue;
            if (value < hbar.Minimum) {
                value = hbar.Minimum;
            } else if (value > hbar.Maximum) {
                value = hbar.Maximum;
            }
            // なぜか2回セットしないと移動しない
            hbar.Value = value;
            hbar.Value = value;
        }
    }
}

Comments

[ianaka3]

返答、おくれて申し訳ありませんでした。
コードまでご提供いただき、ありがとうございます。
頂いたコードをもとにして、試してみたいと思います。ありがとうございました。

Answer 2

AutoScrollPositionプロパティにて設定してください。
このプロパティは癖があるので注意です。

例えば、(100,0)の位置に動かそうとした場合、(100,0)とセットするのですが、AutoScrollPositionを参照すると(-100,0)となります。
ですので、現在位置から右に100動かそうとした場合は
-AutoScrollPosition.X + 100と正負逆転してやらないといけません。

少々読み違えをしていたようです。
描画位置の変更であれば、Graphics.TranslateTransformメソッドで原点をAutoScrollPositionの値で移動してやればどうでしょうか？

Comments

[ianaka3]

返答、遅れて申し訳ありませんでした。
解決策をご提示いただき、ありがとうございました。
頂いた情報をもとに試してみたいと思います。

Answer 3

再描画というより、スクロールした分ずれるような再配置じゃないんでしょうか。
そのスクロールバーで、具体的になにをどうしたいんでしょう

---

ボタンのクリックイベントで、Panel1.Left を増減させてみては。

Comments

[ianaka3]

返答、遅れて申し訳ありませんでした。
うまく伝えることができずに申し訳ありません。