scrolling in text window (#20564)

* grid layout  + better scrollbar

* style

* style

* tabs

* scrollbar behind button fix

* alerts background color fix (#20568)

* horizontal style + more space for scrollbar

* fixes

* fixes

* fixes

* remove background on scroll bar

* fix horizontal overflow

* indent'

Co-authored-by: Comma Device <device@comma.ai>
old-commit-hash: 10e4d32197

selfdrive/ui/qt/text.cc

@@ -6,17 +6,22 @@
 
 #include "qt_window.hpp"
 #include "selfdrive/hardware/hw.h"
+#include "widgets/scrollview.hpp"
 
 int main(int argc, char *argv[]) {
   QApplication a(argc, argv);
   QWidget window;
   setMainWindow(&window);
 
-  QVBoxLayout *layout = new QVBoxLayout();
+  QGridLayout *layout = new QGridLayout;
-  layout->setContentsMargins(125, 125, 125, 125);
+  layout->setMargin(50);
 
-  // TODO: make this scroll
+  QLabel *label = new QLabel(argv[1]);
-  layout->addWidget(new QLabel(argv[1]), 0, Qt::AlignTop);
+  label->setWordWrap(true);
+  label->setSizePolicy(QSizePolicy::Preferred, QSizePolicy::MinimumExpanding);
+  ScrollView *scroll = new ScrollView(label);
+  scroll->setVerticalScrollBarPolicy(Qt::ScrollBarAsNeeded);
+  layout->addWidget(scroll, 0, 0, Qt::AlignTop);
 
   QPushButton *btn = new QPushButton();
 #ifdef __aarch64__
@@ -28,7 +33,7 @@ int main(int argc, char *argv[]) {
   btn->setText("Exit");
   QObject::connect(btn, SIGNAL(released()), &a, SLOT(quit()));
 #endif
-  layout->addWidget(btn, 0, Qt::AlignRight);
+  layout->addWidget(btn, 0, 0, Qt::AlignRight | Qt::AlignBottom);
 
   window.setLayout(layout);
   window.setStyleSheet(R"(
@@ -44,6 +49,7 @@ int main(int argc, char *argv[]) {
       padding-left: 100px;
       border: 2px solid white;
       border-radius: 20px;
+      margin-right: 40px;
     }
   )");
 

selfdrive/ui/qt/widgets/scrollview.cc

@@ -1,3 +1,4 @@
+#include <QScrollBar>
 #include "scrollview.hpp"
 
 ScrollView::ScrollView(QWidget *w, QWidget *parent) : QScrollArea(parent){
@@ -7,6 +8,29 @@ ScrollView::ScrollView(QWidget *w, QWidget *parent) : QScrollArea(parent){
   setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
   setStyleSheet("ScrollView { background-color:transparent; }");
 
+  QString style = R"(
+    QScrollBar:vertical {
+      border: none;
+      background: transparent;
+      width:10px;
+      margin: 0;
+    }
+    QScrollBar::handle:vertical {
+      min-height: 0px;
+      border-radius: 4px;
+      background-color: white;
+    }
+    QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical {
+      height: 0px;
+    }
+    QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
+      background: none;
+    }
+  )";
+
+  verticalScrollBar()->setStyleSheet(style);
+  horizontalScrollBar()->setStyleSheet(style);
+
   QScroller *scroller = QScroller::scroller(this->viewport());
   QScrollerProperties sp = scroller->scrollerProperties();