FAQFAQ   SearchSearch   MemberlistMemberlist   UsergroupsUsergroups   RegisterRegister 
 ProfileProfile   Log in to check your private messagesLog in to check your private messages   Log inLog in 

GridLayout

 
Post new topic   Reply to topic     Forum Index -> DFL
View previous topic :: View next topic  
Author Message
tsalm



Joined: 18 Feb 2008
Posts: 26
Location: France

PostPosted: Sat Feb 07, 2009 11:18 am    Post subject: GridLayout Reply with quote

Hi,

Here is a layout tool for DFL.

It aims to be simple to use.

Here is a part of the example code :
Code:

// Columns formats
  gridLayout.getColumnsSetter() (100, LayoutSizeType.pixel  )
                                (30 , LayoutSizeType.percent)
                                ( )
                                ;
 
  // Lines formats
  gridLayout.getLinesSetter()   (20 , LayoutSizeType.pixel  )
                                (30 , LayoutSizeType.percent)
                                ( )
                                (20 , LayoutSizeType.pixel  )
                                (30 , LayoutSizeType.percent)
                                ;
 
  // Some controls to set in the grid
  Control c1  = new Button() ;
  Control c2  = new Button() ;
  Control c3  = new Button() ;
  Control c4  = new Button() ;
  Control c5  = new Button() ;
  Control c6  = new Button() ;
  Control c7  = new Button() ;
  Control c8  = new Button() ;
  Control c9  = new Button() ;
  Control c10 = new Button() ;
  Control c11 = new Button() ;
 
  // Set controls in the grid
  gridLayout.getControlsSetter() ( c1    )(  c2      )(  c3    ).endline()
                                 ( c4    )( c5,1,1   )(        ).endline()
                                 ( c6    )(          )(        ).endline()
                                 ( c7    )( c8       )(  c9    ).endline()
                                 ( c10,1 )(          )(  c11   ).endline()
                                 ;


TSalm
Back to top
View user's profile Send private message
tsalm



Joined: 18 Feb 2008
Posts: 26
Location: France

PostPosted: Sat Feb 07, 2009 12:40 pm    Post subject: Reply with quote

oops, I've forget the link Rolling Eyes
http://florentgabriel.fr/?q=node/17
Back to top
View user's profile Send private message
rocex



Joined: 23 Apr 2009
Posts: 4

PostPosted: Thu Sep 17, 2009 4:33 am    Post subject: Reply with quote

tsalm wrote:
oops, I've forget the link Rolling Eyes
http://florentgabriel.fr/?q=node/17


cool, thank you for your work. but I can not download the source code, can you put the source code and examples to this forum?
Back to top
View user's profile Send private message
tsalm



Joined: 18 Feb 2008
Posts: 26
Location: France

PostPosted: Thu Sep 17, 2009 2:34 pm    Post subject: Reply with quote

Thanks for your interest.
Now, the download must work well.

If not , here is the source code :
Code:
module talm.gui.dfl.GridLayout;



private import   dfl.all
                ;


/*
 * Unit of a column/line size
 */
enum LayoutSizeType

    pixel     // fixed size 
  , percent   // percent of the fixed remainder
  , remainder // the rest
}

/*
 * This is the main class of this package.
 * GridLayout permit to layout control on a grid
 * Take a look at the example "GridLayoutExample" for more purpose informations
 */
class GridLayout:Panel
{
  public
  {
    RowGridLayout[]    columns
                      ,lines ;     
  }
 
  private
  {
    CellGridLayout[Position] cellGridLayout;
  }
 
  public
  {
   
    this()
    {
      // To avoid the "flick" effect when resizing
      this.setStyle(ControlStyles.ALL_PAINTING_IN_WM_PAINT,true);
    }
   
    /***
     * Remove all controls
     */
    void clearAllControls()
    {
      // remove controls
      foreach(Position p,CellGridLayout cell;cellGridLayout)
      {
        if (cell.control ! is null)
          if (cell.control.parent == cast(Object)this)
            cell.control.parent = null;
      }
     
      // clear the grid
      cellGridLayout = null;
     
    }
   
    /***
     * Use to set columns'sizes
     */
    ColumnsAdder getColumnsSetter()
    {
      columns = null;
      return new ColumnsAdder;
    }
   
    /***
     * Do not use directly. Take a look at getColumnsSetter();
     */
    class ColumnsAdder
    {
      ColumnsAdder opCall( size_t value , LayoutSizeType type )
      {
        columns ~= new RowGridLayout(LayoutSize(value,type));
        return this;
      }
     
      ColumnsAdder opCall()
      {
        columns ~= new RowGridLayout(LayoutSize());
        return this;
      }
     
    }
   
    /***
     * Use to set lines'sizes
     */
    LinesAdder getLinesSetter()
    {
      lines = null;
      return new LinesAdder;
    }
   
    /***
     * Do not use directly. Take a look at getLinesSetter();
     */
    class LinesAdder
    {
      LinesAdder opCall( size_t value , LayoutSizeType type )
      {
        lines ~= new RowGridLayout(LayoutSize(value,type));
        return this;
      }   
     
      LinesAdder opCall()
      {
        lines ~= new RowGridLayout(LayoutSize());
        return this;
      }   
     
    }
   
    /***
     * Use to attach controls on the grid
     */
    public ControlsAdder getControlsSetter()
    {
     
      clearAllControls();
     
      return new ControlsAdder;
     
    }
   
    /***
     * Do not use directly. Take a look at getControlsSetter()
     */
    class ControlsAdder
    {
      size_t currentX,currentY;
     
      this()
      {
        currentX = currentY = 0;       
      }
     
      ControlsAdder opCall( Control control=null , size_t xSpan=0 , size_t ySpan=0 )
      {
        attachControl(control,currentX,currentY,xSpan,ySpan);
       
        currentX++;
       
        return this;
      }
     
      ControlsAdder endline()
      {
        currentX = 0;
        currentY++;
       
        return this;
      }
     
    }
   
    /***
     * Attach a control in a cell of the grid
     */
    void attachControl( Control c , size_t x , size_t y , size_t xSpan=0 , size_t ySpan=0 )
    {
      if (c ! is null)
        c.parent = this;
      else
      {
        cellGridLayout.remove(Position(x,y));
        return;
      }
     
      Position pos;
      pos.x = x;
      pos.y = y;
     
      cellGridLayout[pos] = new CellGridLayout(c,xSpan,ySpan);   
    }
   
    /***
     * Calculate the new columns/lines positions
     */
    private void calculateLayout()
    {
      // Set length
      foreach (rows;[columns,lines])
      {
       
        size_t    lengthTotal;
        size_t    lengthAllocated  = 0 ;
        size_t    r ;
       
        // Total length
        if ( rows == columns )
        {
          lengthTotal = this.width ;
        }
        else
        {
          lengthTotal = this.height ;
        }
       
       
        // first deal with the fixed columns and lines
        foreach (row;rows)
        {
          if ( row.layoutSize.type == LayoutSizeType.pixel )
          {
            with(row)
            {
              _length = layoutSize.value ;
              lengthAllocated += _length ;               
            }
          }
        }
       
        // next, deal with the percent columns and lines
        r = lengthTotal - lengthAllocated;
       
        foreach (row;rows)
        {
          if ( row.layoutSize.type == LayoutSizeType.percent )
          {
            with(row)
            {
              _length = r * layoutSize.value / 100 ;
              lengthAllocated += _length ;             
            }
          }
        }
       
        // next, deal with the rest
        r = lengthTotal - lengthAllocated;
        size_t remaindCount = 0;
       
        //    count
        foreach (row;rows)
          if ( row.layoutSize.type == LayoutSizeType.remainder )
            remaindCount++;
       
        foreach (row;rows)
        {
          if ( row.layoutSize.type == LayoutSizeType.remainder )
          {
            with(row)
            {
              _length = r  / remaindCount ;
              lengthAllocated += _length ;
            }
          }
        }
       
       
      }
     
      // Positions
      foreach (rows;[columns,lines])
      {
        size_t    lengthAllocated  = 0;
       
        foreach (row;rows)
        {
          with(row)
          {
            _pos = lengthAllocated ;
            lengthAllocated += _length ;
          }
       
        }
      }
     
    }

    /***
     * Set positions and sizes of each inner controls.
     * Ususally, a calculateLayout() must be done before.
     */
    private void doLayout()
    {     
      foreach( Position pos,CellGridLayout cell ; cellGridLayout )
      {   
          cell.control.bounds = getRectFromGrid(     
                                         pos.x
                                        ,pos.y
                                        ,cell.xSpan
                                        ,cell.ySpan
                                        );
      }
    }
   
   
    /***
     * Layout positions and sizes of each controls accroding to the current panel position and size.
     */
    void refresh()
    {
      calculateLayout();
      doLayout();
    }
   
   
   
    /***
     * Return true if a control is set at this cell position
     * Params:
     *     x =
     *     y =
     * Returns:
     */
    bool isControlSetInCell(size_t x,size_t y)
    {
      if ( cellGridLayout[Position(x,y)] ! is null )
        if ( cellGridLayout[Position(x,y)].control ! is null )
          return true;
      return false;
    }
   
   
    /**
     * Recalculate controls position in the grid everytime the grid is resizing
     */
    public override void onResize(EventArgs)
    {
      refresh();
    }
   

  }
 

  private
  {
   
    /***
     * Return the position & size of an area of the grid
     * Params:
     *     xStart =
     *     xEnd =
     *     yStart =
     *     yEnd =
     * Returns:
     */
    Rect getRectFromGrid(size_t xStart,size_t yStart,size_t width,size_t height)
    in
    {
      assert( xStart+width<columns.sizeof , "the X end position is out of the grid" );
      assert( yStart+height<lines.sizeof , "the Y end position is out of the grid" );
    }
    body
    {     
      Rect rect;
     
      rect.x      = columns[xStart].pos;
      rect.y      = lines[yStart].pos;
      rect.width  = columns[xStart+width].posEnd - columns[xStart].pos ;
      rect.height = lines[yStart+height].posEnd - lines[yStart].pos ;
     
      return rect;
    }
   
  }
}

//TODO: use the DFL Position struct instead ?
/***
 * X,Y position struct
 */
private struct Position
{
  static Position opCall(size_t x,size_t y)
  {
    Position p;
    p.x = x;
    p.y = y;
    return p;
  }
 
  size_t x,y;
}

/***
 * Represent a row (line or column) of a GridLayout
 */
class RowGridLayout
{
  package size_t      _pos,_length;
 
  LayoutSize  layoutSize;
 
  this(LayoutSize l)
  {
    layoutSize = l;
  }
 
  size_t  pos()     { return _pos    ;      }
  size_t  posEnd()  { return _pos + _length;}
  size_t  length()  { return _length ;      }
 
}

/***
 * Represent a cell of a GridLayout
 */
class CellGridLayout
{
  Control control;
  size_t  xSpan;
  size_t  ySpan;
 
  this(Control c , size_t xSpan = 0 , size_t ySpan = 0 )
  {
    this.control = c;
    this.xSpan = xSpan ;
    this.ySpan = ySpan ;
  }
 
}

/***
 * The size of a row (  value + unit )
 */
struct LayoutSize
{
 
  static LayoutSize opCall()
  {
    return LayoutSize(0,LayoutSizeType.remainder);
  }
 
  static LayoutSize opCall(size_t value,LayoutSizeType type)
  {
    LayoutSize ls;
   
    ls.value = value;
    ls.type  = type;
   
    return ls;
  }
 
  size_t          value;
  LayoutSizeType  type;
 
}


And the code of the example :
Code:
module GridLayoutExample;

import tsalm.gui.dfl.GridLayout;

private {
  import   tango.io.Stdout
          ,tango.text.convert.Format ;
  import   dfl.all;
}

Form f;
GridLayout gridLayout;


void main()
{

  with(f = new Form) {
    clientSize = Size(640,480);
  }
 
  gridLayout = new GridLayout;
 
  gridLayout.parent = f;
  gridLayout.dock = DockStyle.FILL;
  gridLayout.backColor = Color(255,0,0);
 
  // Columns formats
  gridLayout.getColumnsSetter() (100, LayoutSizeType.pixel  )
                                (30 , LayoutSizeType.percent)
                                ( )
                                ;
 
  // Lines formats
  gridLayout.getLinesSetter()   (20 , LayoutSizeType.pixel  )
                                (30 , LayoutSizeType.percent)
                                ( )
                                (20 , LayoutSizeType.pixel  )
                                (30 , LayoutSizeType.percent)
                                ;
 
  // Some controls to set in the grid
  Control c1  = new Button() ;
  Control c2  = new Button() ;
  Control c3  = new Button() ;
  Control c4  = new Button() ;
  Control c5  = new Button() ;
  Control c6  = new Button() ;
  Control c7  = new Button() ;
  Control c8  = new Button() ;
  Control c9  = new Button() ;
  Control c10 = new Button() ;
  Control c11 = new Button() ;
 
  // Set controls in the grid
  gridLayout.getControlsSetter() ( c1    )(  c2      )(  c3    ).endline()
                                 ( c4    )( c5,1,1   )(        ).endline()
                                 ( c6    )(          )(        ).endline()
                                 ( c7    )( c8       )(  c9    ).endline()
                                 ( c10,1 )(          )(  c11   ).endline()
                                 ;
 

 
 

  // Run
  Application.run(f);
 
  return 0;

}
Back to top
View user's profile Send private message
rocex



Joined: 23 Apr 2009
Posts: 4

PostPosted: Thu Sep 17, 2009 10:34 pm    Post subject: Reply with quote

thanks a lot, I have got it. I will test it.
Back to top
View user's profile Send private message
tsalm



Joined: 18 Feb 2008
Posts: 26
Location: France

PostPosted: Tue Jul 27, 2010 11:31 am    Post subject: Reply with quote

Here is some more clear comments for the example :

Code:
  // Columns formats
  gridLayout.getColumnsSetter() (100, LayoutSizeType.pixel  )
                                (30 , LayoutSizeType.percent)
                                ( )
                                ;

This indicate that this grid have 3 columns (column=horizontal):
- the first is of 100 pixel (fixed size)
- the second is of 30% of the total width of the grid (floating size)
- the third take the rest of the width of the grid (floating size)

Code:
  gridLayout.getLinesSetter()   (20 , LayoutSizeType.pixel  )
                                (30 , LayoutSizeType.percent)
                                ( )
                                (20 , LayoutSizeType.pixel  )
                                (30 , LayoutSizeType.percent)

In the same way, this indicate that this grid have 5 rows ( row=vertical ) :
- 1er : 20 pixel (fixed size)
- 2d : 30% of the total height of the grid
- 3 : rest of the height
- 4 : 20 pixels (fixed size)
- 5 : 30% of the total height of the grid

Code:
  gridLayout.getControlsSetter() ( c1    )(  c2      )(  c3    ).endline()
                                 ( c4    )( c5,1,1   )(        ).endline()
                                 ( c6    )(          )(        ).endline()
                                 ( c7    )( c8       )(  c9    ).endline()
                                 ( c10,1 )(          )(  c11   ).endline()

Here, we insert controls in the cells of the grid.
This is simple :
"( c1 )( c2 )( c3 )" <-- this is for the 1er line,this attach the control c1 in the 1st cell, c2 in the second, ...
".endline()" <-- indicate the end of the line

The second line is a little more complicate :
( c5,1,1 ) <-- this attach the control c5, and the 1,1 is a equivalent to the HTML table COLSPAN=2 ROWSPAN=2

For the latest line, you can note the ",1" in (c10,1) , which is an equivalent to COLSPAN=2.

It's simple , isn't it?

-Tsalm
Back to top
View user's profile Send private message
Display posts from previous:   
Post new topic   Reply to topic     Forum Index -> DFL All times are GMT - 6 Hours
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001, 2005 phpBB Group