fixing UI layout

Author: Gin

Common/Qt/Options/ConfigWidget.h

@@ -12,6 +12,17 @@
 namespace PokemonAutomation{
 
 
+//  Base class for all config widgets that control a program option.
+//
+//  It is intuitive to let ConfigWidget inherit QWidget, base class of Qt UI element,
+//  But some derived classes of ConfigWidget, e.g. StringCellWidget, needs to inherit
+//  QWidget's derived classes, e.g. QLineEdit. To avoid nasty diamond inheritance,
+//  ConfigWidget does not inherit QWidget. User has to call ConfigWidget::widget()
+//  to get the actual QWidget.
+//
+//  ConfigWidget's derived classes need to inherit a QWidget or its derived class
+//  and pass *this as the widget in ConfigWidget(m_valuie, widget) so a ConfigWidget
+//  pointer can get the actual QWidget.
 class ConfigWidget : protected ConfigOption::Listener{
 public:
     virtual ~ConfigWidget();

SerialPrograms/Source/CommonTools/Options/StringSelectOption.h

@@ -65,7 +65,8 @@ class StringSelectDatabase{
 };
 
 
-
+//  Config option that creates a cell where users can select a string from
+//  its dropdown menu. It is best to put this cell in a table widget.
 class StringSelectCell : public ConfigOption{
 public:
     ~StringSelectCell();
@@ -117,7 +118,10 @@ class StringSelectCell : public ConfigOption{
 };
 
 
-
+//  Config option that creates a dropdown menu for users to select
+//  a sring. Different from StringSelectCell which is typically used 
+//  in a table, StringSelectOption is considered a standalone option
+//  that comes with its own label.
 class StringSelectOption : public StringSelectCell{
 public:
     StringSelectOption(

SerialPrograms/Source/ML/Programs/ML_LabelImages.cpp

@@ -492,6 +492,7 @@ LabelImages_Widget::LabelImages_Widget(
 
     m_embedding_info_label = new QLabel(this);
 
+    // Main layout
     QVBoxLayout* layout = new QVBoxLayout(this);
     layout->setContentsMargins(0, 0, 0, 0);
     layout->addWidget(make_header(*this));
@@ -513,6 +514,8 @@ LabelImages_Widget::LabelImages_Widget(
     embedding_info_row->addWidget(new QLabel("<b>Image Embedding File:</b> ", this));    
     embedding_info_row->addWidget(m_embedding_info_label);
 
+    // add a row for buttons
+
     QHBoxLayout* button_row = new QHBoxLayout();
     scroll_layout->addLayout(button_row);
 
@@ -525,10 +528,15 @@ LabelImages_Widget::LabelImages_Widget(
     QPushButton* next_anno_button = new QPushButton("Next Annotation", scroll_inner);
     button_row->addWidget(next_anno_button, 1);
 
+    // add a row for user annotation
+    QHBoxLayout* annotation_row = new QHBoxLayout();
+    scroll_layout->addLayout(annotation_row);
+    annotation_row->addWidget(new QLabel("<b>Select Label:</b>", scroll_inner), 0);
+
+    ConfigWidget* option_widget = program.FORM_LABEL.make_QtWidget(*scroll_inner);
+    annotation_row->addWidget(&option_widget->widget(), 5);
 
-    // Add all option UI elements defined by LabelImage program.
-    m_option_widget = program.m_options.make_QtWidget(*scroll_inner);
-    scroll_layout->addWidget(&m_option_widget->widget());
+    // add compute embedding button
 
     QPushButton* compute_embedding_button = new QPushButton("Compute Image Embeddings (SLOW!)", scroll_inner);
     scroll_layout->addWidget(compute_embedding_button);

SerialPrograms/Source/ML/Programs/ML_LabelImages.h

@@ -191,8 +191,9 @@ class LabelImages_Widget : public PanelWidget,
     // show the info about the loaded image embedding data corresponding to the currently
     // displayed image
     QLabel* m_embedding_info_label = nullptr;
-    // a UI widget that holds all the editable UI elements defined in LabelImage program.
-    ConfigWidget* m_option_widget;
+
+    // TODO: see if we can use
+    // Common/Cpp/Options/BoxFloatOption.h and Common/Qt/Options/BoxFloatWidget.h as UI options
 
     std::optional<std::pair<double, double>> m_mouse_start;
     std::optional<std::pair<double, double>> m_mouse_end;

SerialPrograms/Source/ML/UI/ML_ImageAnnotationDisplayWidget.cpp

@@ -46,7 +46,6 @@ ImageAnnotationDisplayWidget::ImageAnnotationDisplayWidget(
     , m_session(session)
     , m_command_receiver(command_receiver)
 {
-    
     QVBoxLayout* layout = new QVBoxLayout(this);
     layout->setContentsMargins(0, 0, 0, 0);
     layout->setAlignment(Qt::AlignTop);

SerialPrograms/Source/ML/UI/ML_ImageAnnotationSourceSelectorWidget.cpp

@@ -39,7 +39,7 @@ ImageAnnotationSourceSelectorWidget::ImageAnnotationSourceSelectorWidget(ImageAn
     QVBoxLayout* layout = new QVBoxLayout(this);
     layout->setContentsMargins(0, 0, 0, 0);
 
-    QHBoxLayout* image_path_row = new QHBoxLayout(this);
+    QHBoxLayout* image_path_row = new QHBoxLayout();
     layout->addLayout(image_path_row);
 
     image_path_row->setContentsMargins(0, 0, 0, 0);
@@ -60,12 +60,12 @@ ImageAnnotationSourceSelectorWidget::ImageAnnotationSourceSelectorWidget(ImageAn
     QPushButton* reload_image_button = new QPushButton("Reload Image", this);
     image_path_row->addWidget(reload_image_button, 0);
 
-    QHBoxLayout* folder_info_row = new QHBoxLayout(this);
+    // add folder info row to show the index of the current image in the folder and buttons to move between images in this folder
+    QHBoxLayout* folder_info_row = new QHBoxLayout();
     layout->addLayout(folder_info_row);
 
     m_folder_info_label = new QLabel(this);
-    folder_info_row->addWidget(m_folder_info_label, 3);
-    folder_info_row->addSpacing(3);
+    folder_info_row->addWidget(m_folder_info_label, 1);
 
     QPushButton* prev_image_button = new QPushButton("Prev Image in Folder", this);
     QPushButton* next_image_button = new QPushButton("Next Image in Folder", this);