Add gap, gap-rows, and gap-columns style attributes

src/app/ui/skin/skin_theme.cpp

@@ -648,6 +648,18 @@ void SkinTheme::loadXml(BackwardCompatibility* backward)
         style->setMinSize(minSize);
         style->setMaxSize(maxSize);
       }
+
+      // Gap
+      {
+        const char* m = xmlStyle->Attribute("gap");
+        const char* r = xmlStyle->Attribute("gap-rows");
+        const char* c = xmlStyle->Attribute("gap-columns");
+        gfx::Size gap = style->gap();
+        if (m || c) gap.w = scale*std::strtol(c ? c: m, nullptr, 10);
+        if (m || r) gap.h = scale*std::strtol(r ? r: m, nullptr, 10);
+        style->setGap(gap);
+      }
+
       // Font
       {
         const char* fontId = xmlStyle->Attribute("font");
@@ -880,6 +892,7 @@ void SkinTheme::initWidget(Widget* widget)
       widget->setStyle(styles.grid());
       BORDER(0);
       widget->setChildSpacing(4 * scale);
+      static_cast<ui::Grid *>(widget)->setGap(styles.grid()->gap());
       break;
 
     case kLabelWidget:

src/ui/grid.cpp

@@ -40,6 +40,8 @@ Grid::Cell::Cell()
 
 Grid::Grid(int columns, bool same_width_columns)
   : Widget(kGridWidget)
+  , m_rowgap(0)
+  , m_colgap(0)
   , m_colstrip(columns)
 {
   ASSERT(columns > 0);
@@ -121,6 +123,18 @@ Grid::Info Grid::getChildInfo(Widget* child)
   return info;
 }
 
+void Grid::setStyle(Style* style)
+{
+  Widget::setStyle(style);
+  setGap(style->gap());
+}
+
+void Grid::setGap(const gfx::Size& gap)
+{
+  m_colgap = gap.w;
+  m_rowgap = gap.h;
+}
+
 void Grid::onResize(ResizeEvent& ev)
 {
   gfx::Rect rect = ev.bounds();
@@ -181,15 +195,20 @@ void Grid::onResize(ResizeEvent& ev)
         if (y+h > rect.y+rect.h-border().bottom())
           h = rect.y+rect.h-border().bottom()-y;
 
+        if (m_colgap < 0 && col+cell->hspan-1 < (int)m_colstrip.size()-1)
+          w += m_colgap;
+        if (m_rowgap < 0 && row+cell->vspan-1 < (int)m_rowstrip.size()-1)
+          h += m_rowgap;
+
         cell->child->setBounds(Rect(x, y, w, h));
       }
 
       if (m_colstrip[col].size > 0)
-        pos_x += m_colstrip[col].size + childSpacing();
+        pos_x += m_colstrip[col].size + childSpacing() + m_colgap;
     }
 
     if (m_rowstrip[row].size > 0)
-      pos_y += m_rowstrip[row].size + childSpacing();
+      pos_y += m_rowstrip[row].size + childSpacing() + m_rowgap;
   }
 }
 
@@ -211,13 +230,14 @@ void Grid::onSizeHint(SizeHintEvent& ev)
 void Grid::sumStripSize(const std::vector<Strip>& strip, int& size)
 {
   int i, j;
+  int gap = &strip == &m_colstrip ? m_colgap : m_rowgap;
 
   size = 0;
   for (i=j=0; i<(int)strip.size(); ++i) {
     if (strip[i].size > 0) {
       size += strip[i].size;
       if (++j > 1)
-        size += this->childSpacing();
+        size += this->childSpacing()+gap;
     }
   }
 }
@@ -225,6 +245,7 @@ void Grid::sumStripSize(const std::vector<Strip>& strip, int& size)
 void Grid::calculateCellSize(int start, int span, const std::vector<Strip>& strip, int& size)
 {
   int i, j;
+  int gap = &strip == &m_colstrip ? m_colgap : m_rowgap;
 
   size = 0;
 
@@ -232,7 +253,7 @@ void Grid::calculateCellSize(int start, int span, const std::vector<Strip>& stri
     if (strip[i].size > 0) {
       size += strip[i].size;
       if (++j > 1)
-        size += this->childSpacing();
+        size += this->childSpacing()+gap;
     }
   }
 }
@@ -283,8 +304,8 @@ void Grid::calculateStripSize(std::vector<Strip>& colstrip,
           // If the widget isn't hidden then we can request its size
           if (!(cell->child->hasFlags(HIDDEN))) {
             Size reqSize = cell->child->sizeHint();
-            cell->w = reqSize.w - (cell->hspan-1) * this->childSpacing();
-            cell->h = reqSize.h - (cell->vspan-1) * this->childSpacing();
+            cell->w = reqSize.w - (cell->hspan-1) * (this->childSpacing()+m_colgap);
+            cell->h = reqSize.h - (cell->vspan-1) * (this->childSpacing()+m_rowgap);
 
             if ((cell->align & align) == align)
               ++expand_count;
@@ -397,6 +418,7 @@ void Grid::distributeStripSize(std::vector<Strip>& colstrip,
                                int rect_size, int border_size, bool same_width)
 {
   int i, j;
+  int gap = &colstrip == &m_colstrip ? m_colgap : m_rowgap;
 
   int max_expand_count = 0;
   for (i=0; i<(int)colstrip.size(); ++i)
@@ -409,7 +431,7 @@ void Grid::distributeStripSize(std::vector<Strip>& colstrip,
     if (colstrip[i].size > 0) {
       total_req += colstrip[i].size;
       if (++j > 1)
-        total_req += this->childSpacing();
+        total_req += this->childSpacing()+gap;
     }
 
     if (colstrip[i].expand_count == max_expand_count || same_width) {
@@ -430,7 +452,7 @@ void Grid::distributeStripSize(std::vector<Strip>& colstrip,
     for (i=0; i<(int)colstrip.size(); ++i) {
       if ((colstrip[i].size == 0) &&
           (colstrip[i].expand_count == max_expand_count || same_width)) {
-        extra_total -= SGN(extra_total)*this->childSpacing();
+        extra_total -= SGN(extra_total)*(this->childSpacing()+gap);
       }
     }
 

src/ui/grid.h

@@ -31,12 +31,19 @@ namespace ui {
 
     void addChildInCell(Widget* child, int hspan, int vspan, int align);
     Info getChildInfo(Widget* child);
+    void setGap(const gfx::Size& gap);
+    void setStyle(Style* style) override;
 
   protected:
     // Events
     void onResize(ResizeEvent& ev) override;
     void onSizeHint(SizeHintEvent& ev) override;
 
+    // Separation between rows of grid cells. Negative values will overlap rows.
+    int m_rowgap;
+    // Separation between columns of grid cells. Negative values will overlap columns.
+    int m_colgap;
+
   private:
     struct Cell {
       Cell* parent;

src/ui/style.cpp

@@ -40,6 +40,7 @@ Style::Style(const Style* base)
   , m_padding(base ? base->padding(): Style::UndefinedBorder())
   , m_minSize(base ? base->minSize(): Style::MinSize())
   , m_maxSize(base ? base->maxSize(): Style::MaxSize())
+  , m_gap(base ? base->gap(): gfx::Size(0, 0))
   , m_font(nullptr)
   , m_mnemonics(base ? base->mnemonics() : true)
 {

src/ui/style.h

@@ -114,6 +114,7 @@ namespace ui {
     const gfx::Border& padding() const { return m_padding; }
     const gfx::Size& minSize() const { return m_minSize; }
     const gfx::Size& maxSize() const { return m_maxSize; }
+    const gfx::Size& gap() const { return m_gap; }
     os::Font* font() const { return m_font.get(); }
     const bool mnemonics() const { return m_mnemonics; }
     const Layers& layers() const { return m_layers; }
@@ -125,6 +126,7 @@ namespace ui {
     void setPadding(const gfx::Border& value) { m_padding = value; }
     void setMinSize(const gfx::Size& sz);
     void setMaxSize(const gfx::Size& sz);
+    void setGap(const gfx::Size& value) { m_gap = value; }
     void setFont(const os::FontRef& font);
     void setMnemonics(const bool enabled) { m_mnemonics = enabled; }
     void addLayer(const Layer& layer);
@@ -140,6 +142,8 @@ namespace ui {
     gfx::Size m_minSize;
     // Max width and height for the widget.
     gfx::Size m_maxSize;
+    // Grid's columns and rows separation in pixels.
+    gfx::Size m_gap;
     os::FontRef m_font;
     bool m_mnemonics;
   };

src/ui/widget.h

@@ -152,7 +152,7 @@ namespace ui {
     Theme* theme() const { return m_theme; }
     Style* style() const { return m_style; }
     void setTheme(Theme* theme);
-    void setStyle(Style* style);
+    virtual void setStyle(Style* style);
     void initTheme();
 
     // ===============================================================