Drawing a Frame around a view widgets

[wimstockman]

Hi , Is there a simple way to draw a rectangle border around a view e.g. FLineEdit widgets. for now I created a class Frame derived from FWidget where I put in all the FLineEdits to then drawborder() around. But I was wondering , why finalcut::drawborder(widget , FRect) doesn't draw a border immediately. I put a picture from what I want.

Really nice widget kit :-) Kind Regards, Wim

[gansm]

Hi Wim, you should have a look at the FScrollView widget. It is also used by FButtonGroup.

Here is a small example how you can use FScrollView:

#include <final/final.h>

int main (int argc, char* argv[])
{
  // Create the application object app
  finalcut::FApplication app(argc, argv);
  app.initTerminal();

  // Create main dialog object
  finalcut::FDialog dialog ("Frame around widgets", &app);
  dialog.setGeometry ({22, 5}, {36, 16});

  // Create scrollview object (frame) as child object of dialog
  finalcut::FScrollView frame(&dialog);
  frame.setGeometry ({3, 1}, {30, 10});
  frame.useParentWidgetColor();
  frame.clearArea();

  // Adding children widgets to the scrollview object (frame)
  finalcut::FLineEdit edit1(&frame);
  finalcut::FLineEdit edit2(&frame);
  finalcut::FLineEdit edit3(&frame);
  finalcut::FLineEdit edit4(&frame);
  edit1.setGeometry ({2, 1}, {25, 1});
  edit2.setGeometry ({2, 3}, {25, 1});
  edit3.setGeometry ({2, 5}, {25, 1});
  edit4.setGeometry ({2, 7}, {25, 1});

  // Add quit button to dialog
  finalcut::FButton quit_button("&Quit", &dialog);
  quit_button.setGeometry({23, 12}, {10, 1});
  quit_button.addCallback ("clicked", [&dialog] () { dialog.close(); } );

  app.setMainWidget(&dialog);
  dialog.show();
  return app.exec();
}

[wimstockman]

Hi , Thx for your quick reply. And the nice example. I'll check the FButtonGroup. Just looking into adding on easy label to the Frame. Here was my code for the moment.

class Frame : public FWidget
{
    public:
        explicit Frame (FWidget* parent) :FWidget{parent}{
        }
    void setText(const FString& txt){
    std::size_t lenght = txt.getLength()+2;
    label.setText(FString()<<" "<<txt<<" ");
    label.setGeometry(FPoint{3,0},FSize{lenght,1});
    label.setBackgroundColor(FColor::White);
    label.setForegroundColor( FColor::Red);
}
    FLabel label{this}; 
    void draw() override {
    useParentWidgetColor();
    drawBorder();
}
};

class FormFct : public Frame
{
    public:
        explicit FormFct (FWidget* parent) :Frame{parent}{
                posx=3; posy=3;
                sizex=30; sizey=1;
                FctNaam1.setGeometry(FPoint{posx,posy},FSize{sizex,sizey});
                posy+=2;
                FctNaam2.setGeometry(FPoint{posx,posy},FSize{sizex,sizey});
                posy+=2;
                FctAdresLijn1.setGeometry(FPoint{posx,posy},FSize{sizex,sizey});
                posy+=2;
                FctLand.setGeometry(FPoint{posx,posy},FSize{3,sizey});
                FctPostCode.setGeometry(FPoint{posx+10,posy},FSize{6,sizey});
                posy+=2;
                FctGemeente.setGeometry(FPoint{posx,posy},FSize{sizex,sizey});
                posy+=2;
        }
    int posx,posy;
    unsigned long int sizex,sizey;
    FLineEdit FctNaam1{this};
    FLineEdit FctNaam2{this};
    FLineEdit FctAdresLijn1{this};
    FLineEdit FctLand{this};
    FLineEdit FctPostCode{this};
    FLineEdit FctGemeente{this};

    void initLayout() override{
        FWidget::setSize(FSize{45,18});
        FWidget::setPos(FPoint{1,1});
        FWidget::initLayout();
        setText("BorderTest");
}

};
int main (int argc, char* argv[])
{
  // Create the application object
  finalcut::FApplication app{argc, argv};

  // Create a simple dialog box
  FDialog dgl{&app};
    dgl.setText("Fact");
    dgl.setGeometry(FPoint{1,1},FSize{145,145});
  FormFct f(&dgl);
  // Set dialog object as main widget
  FWidget::setMainWidget(&dgl);
  // Show and start the application
  dgl.show();
  return app.exec();
}

[gansm]

Hi Wim, your screenshot gave me a good idea. I have now moved the border label methods from FButtonGroup to FScrollView. So now you can also use a border label in FScrollView. The border is also clickable with the mouse, so that when it is activated, the first child widget gets its focus. (see my last commits)

  […]
  frame.setText("Border text");
  […]

[wimstockman]

Hi gansm, Works Like a charm. Thank you.