[freetype2-demos] gsoc-2022-chariri-2 a2b27cb 18/30: [ftinspect] Add `GlyphIndexSelector`, move out related code from `MainGUI`.

[Werner Lemberg]

branch: gsoc-2022-chariri-2
commit a2b27cb6f28b5d1ed56c2e3b604690e143974397
Author: Charlie Jiang <w@chariri.moe>
Commit: Charlie Jiang <w@chariri.moe>

    [ftinspect] Add `GlyphIndexSelector`, move out related code from `MainGUI`.
    
    All code creating glyph index selector buttons are moved to a separate
    `GlyphIndexSelector` widget. This new widget also includes a text box (
    actually a `QSpinBox` without buttons) for directing inputing index, and a
    label indicating current & max glyph index.
    
    Removed `QPushButtonx` since those code setting the smallest width for a
    button was moved to `uihelper.[ch]pp`, because we prefer composition over
    inheritance.
    
    * src/ftinspect/widgets/glyphindexselector.cpp,
      src/ftinspect/widgets/glyphindexselector.hpp: New file, as described.
    
    * src/ftinspect/maingui.cpp, src/ftinspect/maingui.cpp: Moved out all
    navigation code, added `GlyphIndexSelector` into the main GUI.
    
    * src/ftinspect/uihelper.cpp, src/ftinspect/uihelper.hpp: New file, include
    `setButtonNarrowest`.
    
    * src/ftinspect/widgets/customwidgets.cpp,
      src/ftinspect/widgets/customwidgets.hpp: Removed `QPushButtonx`.
    
    * src/ftinspect/CMakeLists.txt, src/ftinspect/meson.build: Updated.
---
 src/ftinspect/CMakeLists.txt                 |   2 +
 src/ftinspect/maingui.cpp                    |  87 ++----------
 src/ftinspect/maingui.hpp                    |  18 +--
 src/ftinspect/meson.build                    |   3 +
 src/ftinspect/uihelper.cpp                   |  29 ++++
 src/ftinspect/uihelper.hpp                   |  13 ++
 src/ftinspect/widgets/customwidgets.cpp      |  25 ----
 src/ftinspect/widgets/customwidgets.hpp      |  13 --
 src/ftinspect/widgets/glyphindexselector.cpp | 204 +++++++++++++++++++++++++++
 src/ftinspect/widgets/glyphindexselector.hpp |  67 +++++++++
 10 files changed, 335 insertions(+), 126 deletions(-)

diff --git a/src/ftinspect/CMakeLists.txt b/src/ftinspect/CMakeLists.txt
index 0dfa312..a3ca49b 100644
--- a/src/ftinspect/CMakeLists.txt
+++ b/src/ftinspect/CMakeLists.txt
@@ -18,6 +18,7 @@ find_package(Freetype REQUIRED)
 add_executable(ftinspect
   "ftinspect.cpp"
   "maingui.cpp"
+  "uihelper.cpp"
   
   "engine/engine.cpp"
   "engine/fontfilemanager.cpp"
@@ -29,6 +30,7 @@ add_executable(ftinspect
   "rendering/grid.cpp"
 
   "widgets/customwidgets.cpp"
+  "widgets/glyphindexselector.cpp"
 
   "models/ttsettingscomboboxmodel.cpp"
 
diff --git a/src/ftinspect/maingui.cpp b/src/ftinspect/maingui.cpp
index fadc782..3a0da13 100644
--- a/src/ftinspect/maingui.cpp
+++ b/src/ftinspect/maingui.cpp
@@ -232,7 +232,9 @@ MainGUI::showFont()
   auto state = settingPanel_->blockSignals(true);
   settingPanel_->checkHinting();
   settingPanel_->blockSignals(state);
-  adjustGlyphIndex(0);
+  indexSelector_->setMin(0);
+  indexSelector_->setMax(currentNumberOfGlyphs_ - 1);
+  indexSelector_->setCurrentIndex(indexSelector_->getCurrentIndex(), true);
 }
 
 
@@ -283,21 +285,17 @@ MainGUI::checkUnits()
 
 
 void
-MainGUI::adjustGlyphIndex(int delta)
+MainGUI::setGlyphIndex(int index)
 {
   // only adjust current glyph index if we have a valid font
   if (currentNumberOfGlyphs_ > 0)
   {
-    currentGlyphIndex_ += delta;
-    currentGlyphIndex_ = qBound(0,
-                               currentGlyphIndex_,
-                               currentNumberOfGlyphs_ - 1);
+    currentGlyphIndex_ = qBound(0, index, currentNumberOfGlyphs_ - 1);
   }
 
   QString upperHex = QString::number(currentGlyphIndex_, 16).toUpper();
-  glyphIndexLabel_->setText(QString("%1 (0x%2)")
-                                   .arg(currentGlyphIndex_)
-                                   .arg(upperHex));
+  glyphIndexLabel_->setText(
+      QString("%1 (0x%2)").arg(currentGlyphIndex_).arg(upperHex));
   glyphNameLabel_->setText(engine_->glyphName(currentGlyphIndex_));
 
   drawGlyph();
@@ -703,6 +701,9 @@ MainGUI::createLayout()
   sizeDoubleSpinBox_->setRange(1, 500);
   sizeLabel_->setBuddy(sizeDoubleSpinBox_);
 
+  indexSelector_ = new GlyphIndexSelector(this);
+  indexSelector_->setSingleMode(true);
+
   unitsComboBox_ = new QComboBox(this);
   unitsComboBox_->insertItem(Units_px, "px");
   unitsComboBox_->insertItem(Units_pt, "pt");
@@ -714,17 +715,6 @@ MainGUI::createLayout()
   dpiSpinBox_->setRange(10, 600);
   dpiLabel_->setBuddy(dpiSpinBox_);
 
-  toStartButtonx_ = new QPushButtonx("|<", this);
-  toM1000Buttonx_ = new QPushButtonx("-1000", this);
-  toM100Buttonx_ = new QPushButtonx("-100", this);
-  toM10Buttonx_ = new QPushButtonx("-10", this);
-  toM1Buttonx_ = new QPushButtonx("-1", this);
-  toP1Buttonx_ = new QPushButtonx("+1", this);
-  toP10Buttonx_ = new QPushButtonx("+10", this);
-  toP100Buttonx_ = new QPushButtonx("+100", this);
-  toP1000Buttonx_ = new QPushButtonx("+1000", this);
-  toEndButtonx_ = new QPushButtonx(">|", this);
-
   zoomLabel_ = new QLabel(tr("Zoom Factor"), this);
   zoomLabel_->setAlignment(Qt::AlignRight | Qt::AlignVCenter);
   zoomSpinBox_ = new QSpinBoxx(this);
@@ -748,21 +738,6 @@ MainGUI::createLayout()
   infoRightLayout->addWidget(glyphNameLabel_, 0, 1);
   infoRightLayout->addWidget(fontNameLabel_, 0, 2);
 
-  navigationLayout_ = new QHBoxLayout;
-  navigationLayout_->setSpacing(0);
-  navigationLayout_->addStretch(1);
-  navigationLayout_->addWidget(toStartButtonx_);
-  navigationLayout_->addWidget(toM1000Buttonx_);
-  navigationLayout_->addWidget(toM100Buttonx_);
-  navigationLayout_->addWidget(toM10Buttonx_);
-  navigationLayout_->addWidget(toM1Buttonx_);
-  navigationLayout_->addWidget(toP1Buttonx_);
-  navigationLayout_->addWidget(toP10Buttonx_);
-  navigationLayout_->addWidget(toP100Buttonx_);
-  navigationLayout_->addWidget(toP1000Buttonx_);
-  navigationLayout_->addWidget(toEndButtonx_);
-  navigationLayout_->addStretch(1);
-
   sizeLayout_ = new QHBoxLayout;
   sizeLayout_->addStretch(2);
   sizeLayout_->addWidget(sizeLabel_);
@@ -793,7 +768,7 @@ MainGUI::createLayout()
   rightLayout_ = new QVBoxLayout;
   rightLayout_->addLayout(infoRightLayout);
   rightLayout_->addWidget(glyphView_);
-  rightLayout_->addLayout(navigationLayout_);
+  rightLayout_->addWidget(indexSelector_);
   rightLayout_->addSpacing(10); // XXX px
   rightLayout_->addLayout(sizeLayout_);
   rightLayout_->addSpacing(10); // XXX px
@@ -822,6 +797,8 @@ MainGUI::createConnections()
           SLOT(showFont()));
   connect(settingPanel_, SIGNAL(repaintNeeded()),
           SLOT(drawGlyph()));
+  connect(indexSelector_, SIGNAL(currentIndexChanged(int)), 
+      this, SLOT(setGlyphIndex(int)));
   connect(sizeDoubleSpinBox_, SIGNAL(valueChanged(double)),
           SLOT(drawGlyph()));
   connect(unitsComboBox_, SIGNAL(currentIndexChanged(int)),
@@ -856,42 +833,6 @@ MainGUI::createConnections()
   connect(nextNamedInstanceButton_, SIGNAL(clicked()),
           SLOT(nextNamedInstance()));
 
-  glyphNavigationMapper_ = new QSignalMapper;
-  connect(glyphNavigationMapper_, SIGNAL(mapped(int)),
-          SLOT(adjustGlyphIndex(int)));
-
-  connect(toStartButtonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-  connect(toM1000Buttonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-  connect(toM100Buttonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-  connect(toM10Buttonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-  connect(toM1Buttonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-  connect(toP1Buttonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-  connect(toP10Buttonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-  connect(toP100Buttonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-  connect(toP1000Buttonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-  connect(toEndButtonx_, SIGNAL(clicked()),
-          glyphNavigationMapper_, SLOT(map()));
-
-  glyphNavigationMapper_->setMapping(toStartButtonx_, -0x10000);
-  glyphNavigationMapper_->setMapping(toM1000Buttonx_, -1000);
-  glyphNavigationMapper_->setMapping(toM100Buttonx_, -100);
-  glyphNavigationMapper_->setMapping(toM10Buttonx_, -10);
-  glyphNavigationMapper_->setMapping(toM1Buttonx_, -1);
-  glyphNavigationMapper_->setMapping(toP1Buttonx_, 1);
-  glyphNavigationMapper_->setMapping(toP10Buttonx_, 10);
-  glyphNavigationMapper_->setMapping(toP100Buttonx_, 100);
-  glyphNavigationMapper_->setMapping(toP1000Buttonx_, 1000);
-  glyphNavigationMapper_->setMapping(toEndButtonx_, 0x10000);
-
   connect(&engine_->fontFileManager(), &FontFileManager::currentFileChanged,
           this, &MainGUI::watchCurrentFont);
 }
@@ -967,7 +908,7 @@ MainGUI::setDefaults()
   checkCurrentFontIndex();
   checkCurrentFaceIndex();
   checkCurrentNamedInstanceIndex();
-  adjustGlyphIndex(0);
+  indexSelector_->setCurrentIndex(indexSelector_->getCurrentIndex(), true);
   zoom();
 }
 
diff --git a/src/ftinspect/maingui.hpp b/src/ftinspect/maingui.hpp
index af4da6d..6172fd7 100644
--- a/src/ftinspect/maingui.hpp
+++ b/src/ftinspect/maingui.hpp
@@ -12,6 +12,7 @@
 #include "rendering/glyphpoints.hpp"
 #include "rendering/grid.hpp"
 #include "widgets/customwidgets.hpp"
+#include "widgets/glyphindexselector.hpp"
 #include "models/ttsettingscomboboxmodel.hpp"
 #include "panels/settingpanel.hpp"
 
@@ -71,7 +72,7 @@ protected:
 private slots:
   void about();
   void aboutQt();
-  void adjustGlyphIndex(int);
+  void setGlyphIndex(int);
   void checkCurrentFaceIndex();
   void checkCurrentFontIndex();
   void checkCurrentNamedInstanceIndex();
@@ -121,6 +122,7 @@ private:
   QAction *exitAct_;
   QAction *loadFontsAct_;
 
+  GlyphIndexSelector* indexSelector_;
   QComboBox *unitsComboBox_;
 
   QDoubleSpinBox *sizeDoubleSpinBox_;
@@ -133,7 +135,6 @@ private:
 
   QHBoxLayout *ftinspectLayout_;
   QHBoxLayout *infoLeftLayout_;
-  QHBoxLayout *navigationLayout_;
   QHBoxLayout *sizeLayout_;
 
   QLabel *dpiLabel_;
@@ -165,19 +166,6 @@ private:
   QPushButton *previousFontButton_;
   QPushButton *previousNamedInstanceButton_;
 
-  QPushButtonx *toEndButtonx_;
-  QPushButtonx *toM1000Buttonx_;
-  QPushButtonx *toM100Buttonx_;
-  QPushButtonx *toM10Buttonx_;
-  QPushButtonx *toM1Buttonx_;
-  QPushButtonx *toP1000Buttonx_;
-  QPushButtonx *toP100Buttonx_;
-  QPushButtonx *toP10Buttonx_;
-  QPushButtonx *toP1Buttonx_;
-  QPushButtonx *toStartButtonx_;
-
-  QSignalMapper *glyphNavigationMapper_;
-
   QSpinBox *dpiSpinBox_;
   QSpinBoxx *zoomSpinBox_;
   
diff --git a/src/ftinspect/meson.build b/src/ftinspect/meson.build
index 8a2787a..a3c71d0 100644
--- a/src/ftinspect/meson.build
+++ b/src/ftinspect/meson.build
@@ -29,6 +29,7 @@ if qt5_dep.found()
     'rendering/glyphpoints.cpp',
     'rendering/grid.cpp',
     'widgets/customwidgets.cpp',
+    'widgets/glyphindexselector.cpp',
 
     'models/ttsettingscomboboxmodel.cpp',
 
@@ -36,12 +37,14 @@ if qt5_dep.found()
 
     'ftinspect.cpp',
     'maingui.cpp',
+    'uihelper.cpp',
 ])
 
   moc_files = qt5.preprocess(
     moc_headers: [
       'engine/fontfilemanager.hpp',
       'widgets/customwidgets.hpp',
+      'widgets/glyphindexselector.hpp',
       'models/ttsettingscomboboxmodel.hpp',
       'panels/settingpanel.hpp',
       'maingui.hpp',
diff --git a/src/ftinspect/uihelper.cpp b/src/ftinspect/uihelper.cpp
new file mode 100644
index 0000000..4242d94
--- /dev/null
+++ b/src/ftinspect/uihelper.cpp
@@ -0,0 +1,29 @@
+// uihelper.cpp
+
+// Copyright (C) 2022 by Charlie Jiang.
+
+#include "uihelper.hpp"
+
+#include <QStyleOptionButton>
+#include <QFontMetrics>
+#include <QString>
+
+// code derived from Qt 4.8.7, function `QPushButton::sizeHint',
+// file `src/gui/widgets/qpushbutton.cpp'
+
+void
+setButtonNarrowest(QPushButton* btn)
+{
+  QStyleOptionButton opt;
+  opt.initFrom(btn);
+  QString s(btn->text());
+  QFontMetrics fm = btn->fontMetrics();
+  QSize sz = fm.size(Qt::TextShowMnemonic, s);
+  opt.rect.setSize(sz);
+
+  sz = btn->style()->sizeFromContents(QStyle::CT_PushButton, &opt, sz, btn);
+  btn->setFixedWidth(sz.width());
+}
+
+
+// end of uihelper.cpp
diff --git a/src/ftinspect/uihelper.hpp b/src/ftinspect/uihelper.hpp
new file mode 100644
index 0000000..d0bac69
--- /dev/null
+++ b/src/ftinspect/uihelper.hpp
@@ -0,0 +1,13 @@
+// uihelper.hpp
+
+// Copyright (C) 2022 by Charlie Jiang.
+
+#pragma once
+
+#include <QPushButton>
+
+// we want buttons that are horizontally as small as possible
+void setButtonNarrowest(QPushButton* btn);
+
+
+// end of uihelper.hpp
diff --git a/src/ftinspect/widgets/customwidgets.cpp 
b/src/ftinspect/widgets/customwidgets.cpp
index e49ed59..893fe0d 100644
--- a/src/ftinspect/widgets/customwidgets.cpp
+++ b/src/ftinspect/widgets/customwidgets.cpp
@@ -62,31 +62,6 @@ QGraphicsViewx::resizeEvent(QResizeEvent* event)
                                      - lastBottomLeftPoint_.y())));
 }
 
-// ------------------------------
-// >>>>>>>> QPushButtonx <<<<<<<<
-// ------------------------------
-
-// code derived from Qt 4.8.7, function `QPushButton::sizeHint',
-// file `src/gui/widgets/qpushbutton.cpp'
-
-QPushButtonx::QPushButtonx(const QString &text,
-                           QWidget *parent)
-: QPushButton(text, parent)
-{
-  QStyleOptionButton opt;
-  opt.initFrom(this);
-  QString s(this->text());
-  QFontMetrics fm = fontMetrics();
-  QSize sz = fm.size(Qt::TextShowMnemonic, s);
-  opt.rect.setSize(sz);
-
-  sz = style()->sizeFromContents(QStyle::CT_PushButton,
-                                 &opt,
-                                 sz,
-                                 this);
-  setFixedWidth(sz.width());
-}
-
 // ---------------------------
 // >>>>>>>> QSpinBoxx <<<<<<<<
 // ---------------------------
diff --git a/src/ftinspect/widgets/customwidgets.hpp 
b/src/ftinspect/widgets/customwidgets.hpp
index 9895419..4c51f63 100644
--- a/src/ftinspect/widgets/customwidgets.hpp
+++ b/src/ftinspect/widgets/customwidgets.hpp
@@ -42,19 +42,6 @@ private:
 };
 
 
-// we want buttons that are horizontally as small as possible
-class QPushButtonx
-: public QPushButton
-{
-  Q_OBJECT
-
-public:
-  QPushButtonx(const QString& text,
-               QWidget* = 0);
-  virtual ~QPushButtonx(){}
-};
-
-
 // we want to have our own `stepBy' function for the zoom spin box
 class QSpinBoxx
 : public QSpinBox
diff --git a/src/ftinspect/widgets/glyphindexselector.cpp 
b/src/ftinspect/widgets/glyphindexselector.cpp
new file mode 100644
index 0000000..13697f4
--- /dev/null
+++ b/src/ftinspect/widgets/glyphindexselector.cpp
@@ -0,0 +1,204 @@
+// glyphindexselector.cpp
+
+// Copyright (C) 2022 Charlie Jiang.
+
+#include "glyphindexselector.hpp"
+
+#include "../uihelper.hpp"
+
+GlyphIndexSelector::GlyphIndexSelector(QWidget* parent)
+: QWidget(parent)
+{
+  createLayout();
+  createConnections();
+}
+
+
+void
+GlyphIndexSelector::setMin(int min)
+{
+  indexSpinBox_->setMinimum(min);
+  indexSpinBox_->setValue(qBound(indexSpinBox_->minimum(),
+                                 indexSpinBox_->value(),
+                                 indexSpinBox_->maximum()));
+  // spinBoxChanged will be automatically called
+}
+
+
+void
+GlyphIndexSelector::setMax(int max)
+{
+  indexSpinBox_->setMaximum(max);
+  indexSpinBox_->setValue(qBound(indexSpinBox_->minimum(),
+                                 indexSpinBox_->value(),
+                                 indexSpinBox_->maximum()));
+  // spinBoxChanged will be automatically called
+}
+
+
+void
+GlyphIndexSelector::setShowingCount(int showingCount)
+{
+  showingCount_ = showingCount;
+  updateLabel();
+}
+
+
+void
+GlyphIndexSelector::setSingleMode(bool singleMode)
+{
+  singleMode_ = singleMode;
+  updateLabel();
+}
+
+
+void
+GlyphIndexSelector::setCurrentIndex(int index, bool forceUpdate)
+{
+  indexSpinBox_->setValue(index);
+  updateLabel();
+  if (forceUpdate)
+    emit currentIndexChanged(indexSpinBox_->value());
+}
+
+
+int
+GlyphIndexSelector::getCurrentIndex()
+{
+  return indexSpinBox_->value();
+}
+
+
+void
+GlyphIndexSelector::adjustIndex(int delta)
+{
+  indexSpinBox_->setValue(qBound(indexSpinBox_->minimum(),
+                                 indexSpinBox_->value() + delta,
+                                 indexSpinBox_->maximum()));
+  emitValueChanged();
+}
+
+
+void
+GlyphIndexSelector::emitValueChanged()
+{
+  emit currentIndexChanged(indexSpinBox_->value());
+  updateLabel();
+}
+
+
+void
+GlyphIndexSelector::updateLabel()
+{
+  if (singleMode_)
+    indexLabel_->setText(QString("%1\nLimit: %2")
+                             .arg(indexSpinBox_->value())
+                             .arg(indexSpinBox_->maximum()));
+  else
+    indexLabel_->setText(QString("%1~%2\nCount: %3\nLimit: %4")
+                             .arg(indexSpinBox_->value())
+                             .arg(indexSpinBox_->value() + showingCount_ - 1)
+                             .arg(showingCount_, indexSpinBox_->maximum()));
+}
+
+
+void
+GlyphIndexSelector::createLayout()
+{
+  toStartButton_ = new QPushButton("|<", this);
+  toM1000Button_ = new QPushButton("-1000", this);
+  toM100Button_ = new QPushButton("-100", this);
+  toM10Button_ = new QPushButton("-10", this);
+  toM1Button_ = new QPushButton("-1", this);
+  toP1Button_ = new QPushButton("+1", this);
+  toP10Button_ = new QPushButton("+10", this);
+  toP100Button_ = new QPushButton("+100", this);
+  toP1000Button_ = new QPushButton("+1000", this);
+  toEndButton_ = new QPushButton(">|", this);
+  
+  indexSpinBox_ = new QSpinBox(this);
+  indexSpinBox_->setCorrectionMode(QAbstractSpinBox::CorrectToNearestValue);
+  indexSpinBox_->setButtonSymbols(QAbstractSpinBox::NoButtons);
+  indexSpinBox_->setRange(0, 0);
+  indexSpinBox_->setFixedWidth(80);
+  indexSpinBox_->setWrapping(true);
+
+  indexLabel_ = new QLabel("0\nCount: 0\nLimit: 0");
+
+  setButtonNarrowest(toStartButton_);
+  setButtonNarrowest(toM1000Button_);
+  setButtonNarrowest(toM100Button_);
+  setButtonNarrowest(toM10Button_);
+  setButtonNarrowest(toM1Button_);
+  setButtonNarrowest(toP1Button_);
+  setButtonNarrowest(toP10Button_);
+  setButtonNarrowest(toP100Button_);
+  setButtonNarrowest(toP1000Button_);
+  setButtonNarrowest(toEndButton_);
+
+  navigationLayout_ = new QHBoxLayout;
+  navigationLayout_->setSpacing(0);
+  navigationLayout_->addStretch(3);
+  navigationLayout_->addWidget(toStartButton_);
+  navigationLayout_->addWidget(toM1000Button_);
+  navigationLayout_->addWidget(toM100Button_);
+  navigationLayout_->addWidget(toM10Button_);
+  navigationLayout_->addWidget(toM1Button_);
+  navigationLayout_->addWidget(toP1Button_);
+  navigationLayout_->addWidget(toP10Button_);
+  navigationLayout_->addWidget(toP100Button_);
+  navigationLayout_->addWidget(toP1000Button_);
+  navigationLayout_->addWidget(toEndButton_);
+  navigationLayout_->addStretch(1);
+  navigationLayout_->addWidget(indexSpinBox_);
+  navigationLayout_->addStretch(1);
+  navigationLayout_->addWidget(indexLabel_);
+  navigationLayout_->addStretch(3);
+
+  setLayout(navigationLayout_);
+}
+
+void
+GlyphIndexSelector::createConnections()
+{
+  connect(indexSpinBox_, QOverload<int>::of(&QSpinBox::valueChanged), 
+          this, &GlyphIndexSelector::emitValueChanged);
+
+  glyphNavigationMapper_ = new QSignalMapper(this);
+  connect(glyphNavigationMapper_, SIGNAL(mapped(int)), SLOT(adjustIndex(int)));
+
+  connect(toStartButton_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+  connect(toM1000Button_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+  connect(toM100Button_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+  connect(toM10Button_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+  connect(toM1Button_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+  connect(toP1Button_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+  connect(toP10Button_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+  connect(toP100Button_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+  connect(toP1000Button_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+  connect(toEndButton_, &QPushButton::clicked,
+          glyphNavigationMapper_, QOverload<>::of(&QSignalMapper::map));
+
+  glyphNavigationMapper_->setMapping(toStartButton_, -0x10000);
+  glyphNavigationMapper_->setMapping(toM1000Button_, -1000);
+  glyphNavigationMapper_->setMapping(toM100Button_, -100);
+  glyphNavigationMapper_->setMapping(toM10Button_, -10);
+  glyphNavigationMapper_->setMapping(toM1Button_, -1);
+  glyphNavigationMapper_->setMapping(toP1Button_, 1);
+  glyphNavigationMapper_->setMapping(toP10Button_, 10);
+  glyphNavigationMapper_->setMapping(toP100Button_, 100);
+  glyphNavigationMapper_->setMapping(toP1000Button_, 1000);
+  glyphNavigationMapper_->setMapping(toEndButton_, 0x10000);
+}
+
+
+// end of glyphindexselector.cpp
diff --git a/src/ftinspect/widgets/glyphindexselector.hpp 
b/src/ftinspect/widgets/glyphindexselector.hpp
new file mode 100644
index 0000000..4c02d55
--- /dev/null
+++ b/src/ftinspect/widgets/glyphindexselector.hpp
@@ -0,0 +1,67 @@
+// glyphindexselector.hpp
+
+// Copyright (C) 2022 by Charlie Jiang.
+
+#pragma once
+
+#include <QWidget>
+#include <QPushButton>
+#include <QSpinBox>
+#include <QSignalMapper>
+#include <QHBoxLayout>
+#include <QLabel>
+
+class GlyphIndexSelector
+: public QWidget
+{
+  Q_OBJECT
+public:
+  GlyphIndexSelector(QWidget* parent);
+  virtual ~GlyphIndexSelector() = default;
+
+  void setMin(int min);
+  void setMax(int max);
+  void setShowingCount(int showingCount);
+  void setSingleMode(bool singleMode);
+
+  void setCurrentIndex(int index, bool forceUpdate = false);
+  int getCurrentIndex();
+
+signals:
+  void currentIndexChanged(int index);
+
+private slots:
+  void adjustIndex(int delta);
+  void emitValueChanged();
+  void updateLabel();
+
+private:
+  bool singleMode_ = true;
+  int showingCount_;
+
+  // min, max and current status are held by `indexSpinBox_`
+
+  QPushButton* toEndButton_;
+  QPushButton* toM1000Button_;
+  QPushButton* toM100Button_;
+  QPushButton* toM10Button_;
+  QPushButton* toM1Button_;
+  QPushButton* toP1000Button_;
+  QPushButton* toP100Button_;
+  QPushButton* toP10Button_;
+  QPushButton* toP1Button_;
+  QPushButton* toStartButton_;
+
+  QLabel* indexLabel_;
+  QSpinBox* indexSpinBox_;
+
+  QHBoxLayout* navigationLayout_;
+
+  QSignalMapper* glyphNavigationMapper_;
+
+  void createLayout();
+  void createConnections();
+};
+
+
+// end of glyphindexselector.hpp