Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Stylesheet to Calender popup
Forum Updated to NodeBB v4.3 + New Features

Stylesheet to Calender popup

Scheduled Pinned Locked Moved Unsolved General and Desktop
5 Posts 3 Posters 16.1k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • S Offline
    S Offline
    Sagar Ojha
    wrote on last edited by
    #1

    how to give stylesheet to QDateEdit Calender popup?
    Is there any example I can go through??

    1 Reply Last reply
    0
    • M Offline
      M Offline
      mostefa
      wrote on last edited by
      #2

      Here is my example for customizing calendarWidget stylesheet

      QCalendarWidget QToolButton {
        	height: 60px;
        	width: 150px;
        	color: white;
        	font-size: 24px;
        	icon-size: 56px, 56px;
        	background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop: 0 #cccccc, stop: 1 #333333);
        }
        QCalendarWidget QMenu {
        	width: 150px;
        	left: 20px;
        	color: white;
        	font-size: 18px;
        	background-color: rgb(100, 100, 100);
        }
        QCalendarWidget QSpinBox { 
        	width: 150px; 
        	font-size:24px; 
        	color: white; 
        	background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop: 0 #cccccc, stop: 1 #333333); 
        	selection-background-color: rgb(136, 136, 136);
        	selection-color: rgb(255, 255, 255);
        }
        QCalendarWidget QSpinBox::up-button { subcontrol-origin: border;  subcontrol-position: top right;  width:65px; }
        QCalendarWidget QSpinBox::down-button {subcontrol-origin: border; subcontrol-position: bottom right;  width:65px;}
        QCalendarWidget QSpinBox::up-arrow { width:56px;  height:56px; }
        QCalendarWidget QSpinBox::down-arrow { width:56px;  height:56px; }
         
        /* header row */
        QCalendarWidget QWidget { alternate-background-color: rgb(128, 128, 128); }
         
        /* normal days */
        QCalendarWidget QAbstractItemView:enabled 
        {
        	font-size:24px;  
        	color: rgb(180, 180, 180);  
        	background-color: black;  
        	selection-background-color: rgb(64, 64, 64); 
        	selection-color: rgb(0, 255, 0); 
        }
         
        /* days in other months */
        /* navigation bar */
      QCalendarWidget QWidget#qt_calendar_navigationbar
      { 
        background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop: 0 #cccccc, stop: 1 #333333); 
      }
      
      QCalendarWidget QAbstractItemView:disabled 
      { 
      color: rgb(64, 64, 64); 
      }
      

      Hope this can help!

      S 1 Reply Last reply
      5
      • M mostefa

        Here is my example for customizing calendarWidget stylesheet

        QCalendarWidget QToolButton {
          	height: 60px;
          	width: 150px;
          	color: white;
          	font-size: 24px;
          	icon-size: 56px, 56px;
          	background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop: 0 #cccccc, stop: 1 #333333);
          }
          QCalendarWidget QMenu {
          	width: 150px;
          	left: 20px;
          	color: white;
          	font-size: 18px;
          	background-color: rgb(100, 100, 100);
          }
          QCalendarWidget QSpinBox { 
          	width: 150px; 
          	font-size:24px; 
          	color: white; 
          	background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop: 0 #cccccc, stop: 1 #333333); 
          	selection-background-color: rgb(136, 136, 136);
          	selection-color: rgb(255, 255, 255);
          }
          QCalendarWidget QSpinBox::up-button { subcontrol-origin: border;  subcontrol-position: top right;  width:65px; }
          QCalendarWidget QSpinBox::down-button {subcontrol-origin: border; subcontrol-position: bottom right;  width:65px;}
          QCalendarWidget QSpinBox::up-arrow { width:56px;  height:56px; }
          QCalendarWidget QSpinBox::down-arrow { width:56px;  height:56px; }
           
          /* header row */
          QCalendarWidget QWidget { alternate-background-color: rgb(128, 128, 128); }
           
          /* normal days */
          QCalendarWidget QAbstractItemView:enabled 
          {
          	font-size:24px;  
          	color: rgb(180, 180, 180);  
          	background-color: black;  
          	selection-background-color: rgb(64, 64, 64); 
          	selection-color: rgb(0, 255, 0); 
          }
           
          /* days in other months */
          /* navigation bar */
        QCalendarWidget QWidget#qt_calendar_navigationbar
        { 
          background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop: 0 #cccccc, stop: 1 #333333); 
        }
        
        QCalendarWidget QAbstractItemView:disabled 
        { 
        color: rgb(64, 64, 64); 
        }
        

        Hope this can help!

        S Offline
        S Offline
        Sagar Ojha
        wrote on last edited by
        #3

        @mostefa Thanks for this coustomization example. It is giving me controll for complete counstomization, but I am not able to set background color for the calender. Calender poped up after clicking on QDateEdit.

        1 Reply Last reply
        0
        • yuvaramY Offline
          yuvaramY Offline
          yuvaram
          wrote on last edited by
          #4

          Hi @Sagar-Ojha

          In Qt Assistant stylesheet samples are provided.
          Search as : Qt Style Sheets Examples

          QString DEstylesheet = "QDateEdit { padding-right: 15px; border-width: 3;height : 30;font-size:20pt;color:#fff;"
                  "background-color: qlineargradient(spread:pad, x1:0.517, y1:0, x2:0.517, y2:1, stop:0 rgba(45, 45, 45, 255), stop:0.505682 rgba(45, 45, 45, 255), stop:1 rgba(29, 29, 29, 255));}"
                  ;
          
          m_DE       = new QDateEdit;
          m_DE->setStyleSheet(DEstylesheet);
          

          Yuvaram Aligeti
          Embedded Qt Developer
          : )

          1 Reply Last reply
          0
          • M Offline
            M Offline
            mostefa
            wrote on last edited by
            #5

            @Sagar-Ojha

            Not sure i understand what do you want,

            background-color of calendarWidget , is already changed with my sample code:

            QCalendarWidget QAbstractItemView:enabled 
            {
            	font-size:24px;  
            	color: rgb(180, 180, 180);  
            	background-color: green;  // here background-color is changed !!!
            	selection-background-color: rgb(64, 64, 64); 
            	selection-color: rgb(0, 255, 0); 
            }
            
            1 Reply Last reply
            0

            • Login

            • Login or register to search.
            • First post
              Last post
            0
            • Categories
            • Recent
            • Tags
            • Popular
            • Users
            • Groups
            • Search
            • Get Qt Extensions
            • Unsolved