Inesperto totole cerca di modificare un file .qss



  • Ciao a tutti,avrei bisogno di un aiuto.
    Premetto che non so niente di niente di Qt e nemmeno di programmazione in generale.

    Sto cercando di modificare l'aspetto di un programma,molto basilare suppongo,visto che ci sto capendo qualcosa pure io.

    0_1501172394233_cutetorrent.jpg

    quello che mi serve è coprire lo spazio rosso con la menu bar,la toolbar e la status bar. Il rosso poi diventerà dello stesso colore grigio che c'è li a fianco e quindi non mi serv modificare nche la colonna con tutte le voci dei torrent
    Riesco solo a coprirlo allargando il bordo esterno della finiestra ma non voglio indrandirlo,anzi l'ho rimpicciolito apposta e poi mi sono accorto che le varie barre non si allargavano in automatico

    Questo è tutto il contenuto del file .qss

    QDialog,#CustomWindow {
        background-color: #f0f0f0;
        border: 1px solid #909090;
            background-color: #c2c2c2;
    }
    
    #titleBar {
        background-color: #c2c2c2;
    }
    
    #createButton {
        min-width: 45px;
    }
    
    #m_centralWidget {
        margin: 1px;
        margin-top: 0;
        background-color: #f30;
    }
    #centralWidget {
        margin: 1px;
        margin-top: 0;
        background-color: #fff400;
    }
    
    #m_pTorrentListView {
            border: 1px solid #909090;
            border-right: none;
            background-color: #ffffff;
    
    }
    
    #ItemListContainer{
            padding-top: 6px;
            border-left: 1px solid #909090;
            background-color: #f0f0f0;
    }
    #torrentSorterContainer{
    	 border: none;
    }
    #torrentSorterView::section {
        border-bottom: none;
    }
    
    #torrentSorterView {
        border-left: 1px solid #d82929;
        border-top: 1px solid #d82929;
        border-bottom: none;
        border-right: none;
        min-height: 18px;
        max-height: 18px;
    }
    
    #m_pGroupTreeView {
        border: none;
        background-color: #f0f0f0;;
    }
    
    #pbMin,#pbMax,#pbClose,#closeBaloon {
        border: none;
        background-color: transparent;
        min-width: 0;
        margin-right: 0;
        margin-right: 1px;
        padding: 1px;
    }
    
    #pbMin:hover,#pbMax:hover,#pbClose:hover,#closeBaloon:hover {
        background-color: rgba(60,60,60,150);
        border: 1px outset #909090;
        border-radius: 3px;
    }
    
    #torrentFilesTreeView {
        border-right: 1px solid #909090;
    }
    
    #hotKeyScrollArea {
        margin: 0 -1px;
    }
    
    #mystatusBar {
        margin-left: -20px;
        background-color: #f0f0f0;
    }
    
    QWidget:item:hover:!selected {
        background: #ddd;
        color: #000;
    }
    
    QWidget::branch:selected,QWidget:item:selected:!hover,QWidget:item:selected:hover {
        background: #cdcdcd;
        color: #000;
    }
    
    QScrollBar:horizontal {
        border: 1px solid #909090;
        background: #fff;
        height: 12px;
        margin: 0 -1px -1px;
    }
    
    QScrollBar::handle:horizontal {
        background: #999;
        min-height: 20px;
    }
    
    QScrollBar::add-line:horizontal {
        background: #999;
        width: 0;
        subcontrol-position: right;
        subcontrol-origin: margin;
    }
    
    QScrollBar::sub-line:horizontal {
        background: #999;
        width: 0;
        subcontrol-position: right;
        subcontrol-origin: margin;
    }
    
    QScrollBar::right-arrow:horizontal,QScrollBar::left-arrow:horizontal {
        height: 0;
    }
    
    QScrollBar::add-page:horizontal,QScrollBar::sub-page:horizontal {
        height: 0;
        background: none;
    }
    
    QScrollBar:vertical {
        border: 1px solid #909090;
        background: #fff;
        width: 12px;
        margin: -1px -1px -1px 0;
    }
    
    QScrollBar::handle:vertical {
        background: #999;
        min-height: 20px;
    }
    
    QScrollBar::add-line:vertical {
        height: 0;
        subcontrol-position: bottom;
        subcontrol-origin: margin;
    }
    
    QScrollBar::sub-line:vertical {
        height: 0;
        subcontrol-position: top;
        subcontrol-origin: margin;
    }
    
    QScrollBar::up-arrow:vertical,QScrollBar::down-arrow:vertical {
        border: none;
        height: 0;
    }
    
    QScrollBar::add-page:vertical,QScrollBar::sub-page:vertical {
        height: 0;
        background: none;
    }
    
    QSpinBox,QDateTimeEdit,QDoubleSpinBox,QDateEdit,QTimeEdit {
        padding-right: 15px;
    /* make room for the arrows */
        border: 1px solid #909090;
        background-color: #f0f0f0;
    }
    
    QSpinBox::up-button,QDateTimeEdit::up-button,QDoubleSpinBox::up-button,QDateEdit::up-button,QTimeEdit::up-button {
        subcontrol-origin: border;
        subcontrol-position: top right;
    /* position at the top right corner */
        width: 16px;
    /* 16 + 2*1px border-width = 15px padding + 3px parent border */
        border: 1px solid #909090;
        background-color: #f0f0f0;
    }
    
    QSpinBox::up-arrow,QDateTimeEdit::up-arrow,QDoubleSpinBox::up-arrow,QDateEdit::up-arrow,QTimeEdit::up-arrow {
        width: 7px;
        height: 7px;
        image: url($[STYLE_DIR]/spin-plus.png);
    }
    
    QSpinBox::down-button,QDateTimeEdit::down-button,QDoubleSpinBox::down-button,QDateEdit::down-button,QTimeEdit::down-button {
        subcontrol-origin: border;
        subcontrol-position: bottom right;
    /* position at bottom right corner */
        width: 16px;
        border: 1px solid #909090;
        border-top: none;
        background-color: #f0f0f0;
    }
    
    QSpinBox::down-button:hover,QSpinBox::up-button:hover,QDateEdit::down-button:hover,QDateEdit::up-button:hover,QDoubleSpinBox::down-button:hover,QDoubleSpinBox::up-button:hover,QDateTimeEdit::down-button:hover,QDateTimeEdit::up-button:hover,QTimeEdit::down-button:hover,QTimeEdit::up-button:hover {
        background-color: #d6d6d6;
    }
    
    QSpinBox::down-button:pressed,QSpinBox::up-button:pressed,QDateEdit::down-button:pressed,QDateEdit::up-button:pressed,QDoubleSpinBox::down-button:pressed,QDoubleSpinBox::up-button:pressed,QDateTimeEdit::down-button:pressed,QDateTimeEdit::up-button:pressed,QTimeEdit::down-button:pressed,QTimeEdit::up-button:pressed {
        background-color: #c1c1c1;
    }
    
    QSpinBox::down-arrow,QDateTimeEdit::down-arrow,QDoubleSpinBox::down-arrow,QDateEdit::down-arrow,QTimeEdit::down-arrow {
        image: url($[STYLE_DIR]/spin-minus.png);
        width: 7px;
        height: 7px;
    }
    
    QMenuBar {
        background-color: qlineargradient(spread:reflect,x1:1,y1:1,x2:1,y2:1.488636,stop:0.1 #dfe5f0,stop:1 #c9d5ea);
        border-bottom: 1px solid #d8d8d8;
        border-top: 1px solid #d8d8d8;
    }
    
    QMenu {
        border: 1px solid #909090;
    }
    
    QMenu::item,QMenuBar::item {
        padding: 3px 10px;
        background: transparent;
    }
    
    QMenu::item {
        padding-left: 28px;
    }
    
    QMenu::item:disabled,QMenuBar::item:disabled {
        color: gray;
    }
    
    QMenu::item:enabled:selected,QMenuBar::item:enabled:selected {
        border: 1px solid #909090;
        background-color: qlineargradient(spread:reflect,x1:1,y1:1,x2:1,y2:1.488636,stop:0.1 #dfe5f0,stop:1 #c9d5ea);
    /**/
    }
    
    QMenu::item:enabled:selected {
        border-top: 1px solid #909090;
    }
    
    QMenu::icon:checked {
        border: 2px inset gray;
        position: absolute;
        top: 1px;
        right: 2px;
        bottom: 1px;
        left: 1px;
    }
    
    QMenu::icon {
        padding: 1px 2px;
    }
    
    QMenuBar::item:enabled:open {
        color: #fff;
        background-color: #787878;
        border: 1px solid #909090;
        border-bottom: 0 none;
    /*: ;
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
        /**/
    }
    
    QTabWidget::pane {
    /* The tab widget frame */
        border: 1px solid #909090;
        position: absolute;
        top: -1px;
        background-color: #f0f0f0;
    }
    
    #tabWidget::pane {
    /* The tab widget frame */
        border-left: none;
        border-right: none;
    }
    
    /* Style the tab using the tab sub-control. Note that
        it reads QTabBar _not_ QTabWidget */
    QTabBar::tab {
        background: #787878;
        border: 1px solid #909090;
        min-width: 80px;
        padding: 2px;
    }
    
    QTabBar::tab:selected {
        background: #f0f0f0;
        border-top: 1px solid #2166AB;
        border-bottom: none;
    }
    
    QTabBar::tab:hover:!selected {
        background: #ddd;
        border-top: 1px solid #2166AB;
        border-bottom: none;
    }
    
    QTabBar::tab:!selected {
        margin-top: 2px;
    /* make non-selected tabs look smaller */
        background-color: #c2c2c2;
    }
    
    QTreeView {
        left: 15px;
        border: 1px solid #909090;
        background-color: #ffffff;
        show-decoration-selected: 1;
        outline: 0;
    }
    
    QTreeView::item:selected:active {
        background: #cdcdcd;
        color: #000;
        border: 0 solid grey;
    }
    
    QTreeView::item:selected:!active {
        background: #cdcdcd;
        color: #000;
        border: 0 solid grey;
    }
    
    QTreeView::branch {
        background: transparent;
    }
    
    QTreeView::branch:has-siblings:!adjoins-item {
        border-image: url($[STYLE_DIR]/vline.png) 0;
    }
    
    QTreeView::branch:hover {
        background: #ddd;
    }
    
    QTreeView::branch:selected {
        background: #cdcdcd;
    }
    
    QTreeView::branch:has-siblings:adjoins-item {
        border-image: url($[STYLE_DIR]/branch-more.png) 0;
    }
    
    QTreeView::branch:!has-children:!has-siblings:adjoins-item {
        border-image: url($[STYLE_DIR]/branch-end.png) 0;
    }
    
    QTreeView::branch:has-children:!has-siblings:closed,QTreeView::branch:closed:has-children:has-siblings {
        border-image: none;
        image: url($[STYLE_DIR]/branch-closed.png);
    }
    
    QTreeView::branch:open:has-children:!has-siblings,QTreeView::branch:open:has-children:has-siblings {
        border-image: none;
        image: url($[STYLE_DIR]/branch-open.png);
    }
    
    QListView {
        border: 1px solid #909090;
        background-color: #ffffff;
        outline: 0;
    }
    
    QHeaderView {
        background-color: #c2c2c2;
        border-bottom: 1px solid #909090;
    }
    
    QHeaderView::section {
        background-color: #c2c2c2;
        border: none;
    	padding-left: 4px;
        border-right: 1px solid #909090;
        border-bottom: 1px solid #909090;
        min-height: 20px;
    }
    
    QHeaderView::section:last {
        margin-right: -1px;
    }
    
    QHeaderView::section:pressed {
        background-color: #A1A1A1;
    }
    
    QHeaderView::down-arrow {
        image: url($[STYLE_DIR]/sort-down.png);
        right: 4px;
        width: 10px;
        height: 10px;
    }
    
    QHeaderView::up-arrow {
        image: url($[STYLE_DIR]/sort-up.png);
        right: 2px;
        width: 10px;
        height: 10px;
    }
    
    QComboBox {
        border: 1px solid #909090;
        padding: 0 18px 0 3px;
        min-width: 6em;
        background-color: #f0f0f0;
    }
    
    QComboBox::drop-down {
        border-width: 1px;
    }
    
    QComboBox::down-arrow {
        image: url($[STYLE_DIR]/down-arrow.png);
        width: 16px;
        height: 16px;
        border-right: 1px solid #909090;
    }
    
    QPushButton {
        border: 1px solid #909090;
        background-color: #ccc;
        min-width: 40px;
        padding: 1px 4px;
    }
    
    QPushButton:pressed {
        background-color: #A1A1A1;
    }
    
    QPushButton:flat {
        border: none;
    	background-color: transparent;
    /* no border for a flat push button */
    }
    
    QPushButton:default {
        border-color: #909090;
    /* make the default button prominent */
    }
    
    QGroupBox {
        border: 1px solid #909090;
        background-color: #f0f0f0;
        margin-top: 2ex;
    }
    
    QLineEdit,QTextEdit {
        border: 1px solid #909090;
        background-color: #f0f0f0;
        selection-background-color: #a9a9a9;
    }
    
    QGroupBox::title {
        left: 4px;
        subcontrol-origin: margin;
        subcontrol-position: top left;
    /* position at the top center */
        padding: 0 3px;
    }
    
    QCheckBox {
        spacing: 5px;
    }
    
    QListView::indicator,QTreeView::indicator,QGroupBox::indicator,QCheckBox::indicator,QRadioButton::indicator {
        width: 13px;
        height: 13px;
    }
    
    QRadioButton::indicator::unchecked {
        image: url($[STYLE_DIR]/radiobutton-unchecked.png);
    }
    
    QRadioButton::indicator::checked {
        image: url($[STYLE_DIR]/radiobutton-checked.png);
    }
    
    QListView::indicator:unchecked,QTreeView::indicator:unchecked,QGroupBox::indicator:unchecked,QCheckBox::indicator:unchecked {
        image: url($[STYLE_DIR]/checbox-unchecked.png);
    }
    
    QListView::indicator:checked,QTreeView::indicator:checked,QGroupBox::indicator:checked,QCheckBox::indicator:checked {
        image: url($[STYLE_DIR]/checbox-checked.png);
    }
    
    QTreeView::indicator:indeterminate {
        image: url($[STYLE_DIR]/checbox-partitaly-checked.png);
    }
    
    QToolBar {
        border-bottom: 1px solid #909090;
        spacing: 3px;
        padding-right: 2px;
        background: #d5dae7;
    }
    
    QToolBar QToolButton {
        background: transparent;
        border: 1px solid transparent;
        margin: 1px;
    }
    
    QToolBar QToolButton:hover {
        background-color: rgba(120,120,120,150);
        border: 1px outset #909090;
    }
    
    QToolBar QToolButton:pressed {
        background-color: rgba(214,214,214,150);
        border: 1px inset #909090;
    }
    
    QToolBar QToolButton:checked {
        background-color: rgba(200,200,200,150);
        border: 1px inset gray;
    }
    
    QProgressBar {
        border: 1px solid #909090;
    }
    
    QProgressBar[value="100"] {
        background-color: qlineargradient(spread:reflect,x1:0.994318,y1:1,x2:1,y2:0.488636,stop:0.0397727 rgba(255,255,255,255),stop:0.431818 rgba(50,145,212,255));
    }
    
    QWidget#QBalloonTip {
        border: 1px solid #909090;
        background-color: #f0f0f0;
    }
    
    HtmlView {
        margin: 0 -1px;
    }
    
    #sortDirectionToggleButton {
    	min-width: 20px;
    }
    
    

    quello che ho scoperto è che il rosso (che ho messo io) è in

    #m_centralWidget {
        margin: 1px;
        margin-top: 0;
        background-color: #f30;
    }
    
    

    mentre i bordi esterni li controllo con

    #centralWidget {
        margin: 1px;
        margin-top: 0;
        background-color: #fff400;
    }
    
    

    Alcune voci magari sono inutili..tipo modificando i margini di m_centralwidget non succede niente,e nemmeno se modifico lo sfondo di centralwidget (dovrebbe esser giallo ma non vedo niente giallo io)
    Ho provato a mettere widht e margin alle varie barre ma non succede niente...o meglio niente di utile.



  • Devo dire non e' molto chiaro cosa tu voglia ottenere. Comunque, gli stili applicati con # si riferiscono agli oggetti con nome, devi guardare nel codice dove viene chiamato setObjectName() e vedere a cosa si riferisce senza il codice puoi solo andare alla cieca.



  • @VRonin said in Inesperto totole cerca di modificare un file .qss:

    Devo dire non e' molto chiaro cosa tu voglia ottenere. Comunque, gli stili applicati con # si riferiscono agli oggetti con nome, devi guardare nel codice dove viene chiamato setObjectName() e vedere a cosa si riferisce senza il codice puoi solo andare alla cieca.

    ho scritto: voglio allungare toolbar e menubar per coprire il rosso,così
    0_1501176188385_cutetorrent - Copia.jpg
    il rosso rimanente non è importante perchè lo sistemo in altro modo



  • Ciao .. da quello che capisco vuoi inserire una QToolBar a meta in un qualsiasi Widged... allungare il QToolBar non è un problema.. questo è semplice e documentato ... i menu di selezione e azioni possono essre ovunque anhe nel tasto destro o nella trayicon o su mac pure nella icona della app.. o anche con le librerie del rionoscimento vocale che diventano sempre meglio... hai messo il codice in qualche angolo da vedere? essendo un torrent app..?
    i file qss sono un po come i css in html .. ma con quelli non succedono grandi cose nessuno compra una ferrari con 2 cavalli... colorati in modo divino .. al massimo si fa una foto... ;-)


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.