DOCSLIB.ORG

Rich Custom GUI with Glade and CSS

Total Page：16

File Type：pdf, Size：1020Kb

Download full-text PDF Read full-text
Rich Custom GUI with Glade and CSS Rich custom GUI with Glade and CSS by Juan Pablo Ugarte GUADEC 2013 Brno, Czech Republic August 1 - 8 TM The GNOME Conference ●GUADEC● Graphical User Intefaces GNOME 2.10 screenshot showing Rhythmbox, GThumb, gedit and Nautilus Graphical User Intefaces XMMS/Audacious Winamp classic interface Audacious Gtk Interface SyncTV Desktop Player - Mockup SyncTV artist design SyncTV Desktop Player - Gtk 2.0 SyncTV Desktop Player - Gtk 2.0 Rich custom GUI with Glade and CSS Enough with the screenshots! ∙ Case Study: Baccarat display for Casinos ∙ Artist mockup ∙ CSS implementation ∙ Final Product Baccarat Mockup Use images for: << Min/Max Bet Frame ∙ Logo ∙ Backgrounds ∙ Icons CSS for: ∙ all text ∙ custom elements << Play Grid (frames and grid) << Information Frame Glade and the widget hierarchy Glade + CSS Implementing Bet Frame .font_bet { color: #47423f; font-size: 44px; font-weight:bold; } + MIN: 10 GtkFrame.frame_bet { = border: 6px solid; MAX: 50 border-color: #c1c0bf; border-radius: 24px; background-color: white; box-shadow: 2px 2px 4px black inset; } Implementing Info Frame GtkFrame.frame_shadow { border: 0px; padding: 0px 4px 4px 0px; border-radius: 16px; background-color: #47423F; } + Player: 43 GtkFrame.frame_default { border: 0px; padding: 0px; = Banker: 23 border-radius: 16px; background-color: #5c7dbe; Tie: 03 } + .font_default { color: white; font-size: 42px; text-shadow: 2px 2px 2px black; } Implementing the Play Grid GtkFrame.frame_grid { border: 8px solid #c1c0bf; GtkGrid.frame_grid > GtkImage { border-radius: 32px; box-shadow: 2px 2px 2px grey inset; background-image: -gtk-gradient (linear, } left top, right bottom, GtkImage.grid_child_odd { from(#9d9a99), to(#d6d5d4)); background-color: #ededeb; box-shadow: 2px 2px 2px grey inset; } } Baccarat CSS/GTK implementation @keyframes player_transition { 0% { background-image: none;} 100% { background-image: url("blue.png");} } GtkImage.grid_top_left { GtkImage.grid_top_right { border-radius: border-radius: 22px 0px 0px 0px; 0px 22px 0px 0px; } } GtkImage.grid_bottom_left { GtkImage.grid_bottom_right { border-radius: border-radius: 0px 0px 0px 22px; 0px 0px 22px 0px; } } GtkGrid.frame_grid > GtkImage.bg_player_anim { animation: player_transition .5s 1 linear; } Baccarat CSS/GTK implementation Finished Product To Do List xjuan@Xjuan:~/sources/glade$ git checkout master xjuan@Xjuan:~/sources/glade$ git rebase css /* * TODO: * * Add a way to disable CSS animations * in the workspace. * * Add <style type="text/css" href="file.css"> * to GtkBuilder?????????? * */ while (slow ()) make_it_faster (); BTW this presentation was made with Glade and CSS ThankGracias You Email: [email protected] [email protected] Blog: blogs.gnome.org/xjuan ██████████████ ██ ██ ██ ██ ██████ ██████████████ ██ ██ ████████ ██ ██ ██ ██ ██ ██ IRC: xjuan ██ ██████ ██ ██████ ██ ██ ██ ██ ██████ ██ ██ ██████ ██ ██████ ████ ████████ ██ ██ ██████ ██ ██ ██████ ██ ██ ████ ██ ██ ██ ██████ ██ ██ ██ ████ ██ ████████ ██ ██ ██████████████ ██ ██ ██ ██ ██ ██ ██ ██████████████ ██ ████████████████ ████████ ██ ██ ██████████████████ ██ ██████ ██ ██ ██ ██ ██ ██ ██ ████ ████████████ ██ ████ ████ ██████████ ██ ██ ████ ██ ████ ██████████ ████████ ████ ██ ████████████ ██ ██ ████ ██ ██████ ████████ ██ ██ ██ ████ ████ ████ ████ ██ ████ ██ ████ ██████ ████████████ ██ ██ ██ ██████ ████████ ████ ██ ██ ██ ██ ██ ██████ ██ ██ ████ ██████████ ██ ██ ██ ██ ████ ██ ██ ████ ██ ██ ████ ██ ██ ██ ████ ██ ██ ██████ ██████ ██████ ██ ██ ██ ████ ██ ██████████ ██████ ██ ████ ██ ██ ████ ████████ ██ ██ ██████ ██████████████ ██ ██ ██ ██ ██ ██████████ Handout: ██████████████ ████ ██████████ ██ ████ ██ ██ ██ ██ ██████████ ██ ██ ██ ████ ██ ██████ ██ ██ ████ ████ ████████████████ http://people.gnome.org/~jpu/docs\ ██ ██████ ██ ██ ████ ██████ ██ ██ ████ ██ ██ ██ ██████ ██ ██ ██ ████ ██████ ██ ██ ██ ██ ██ ██ ██████ ██ ██████ ██ ████████ ██ /2013-GUADEC/ ██████████████ ██ ██ ██ ██████ ██ ██ .
Load more

Recommended publications
  • Desktop Migration and Administration Guide
    Red Hat Enterprise Linux 7 Desktop Migration and Administration Guide GNOME 3 desktop migration planning, deployment, configuration, and administration in RHEL 7 Last Updated: 2021-05-05 Red Hat Enterprise Linux 7 Desktop Migration and Administration Guide GNOME 3 desktop migration planning, deployment, configuration, and administration in RHEL 7 Marie Doleželová Red Hat Customer Content Services [email protected] Petr Kovář Red Hat Customer Content Services [email protected] Jana Heves Red Hat Customer Content Services Legal Notice Copyright © 2018 Red Hat, Inc. This document is licensed by Red Hat under the Creative Commons Attribution-ShareAlike 3.0 Unported License. If you distribute this document, or a modified version of it, you must provide attribution to Red Hat, Inc. and provide a link to the original. If the document is modified, all Red Hat trademarks must be removed. Red Hat, as the licensor of this document, waives the right to enforce, and agrees not to assert, Section 4d of CC-BY-SA to the fullest extent permitted by applicable law. Red Hat, Red Hat Enterprise Linux, the Shadowman logo, the Red Hat logo, JBoss, OpenShift, Fedora, the Infinity logo, and RHCE are trademarks of Red Hat, Inc., registered in the United States and other countries. Linux ® is the registered trademark of Linus Torvalds in the United States and other countries. Java ® is a registered trademark of Oracle and/or its affiliates. XFS ® is a trademark of Silicon Graphics International Corp. or its subsidiaries in the United States and/or other countries. MySQL ® is a registered trademark of MySQL AB in the United States, the European Union and other countries.
    [Show full text]
  • Adding Support for Jamendo and Magnatune to Rhythmbox on Linux
    Walking in Light with Christ - Faith, Computing, Diary Articles & tips and tricks on GNU/Linux, FreeBSD, Windows, mobile phone articles, religious related texts http://www.pc-freak.net/blog Adding support for Jamendo and Magnatune to Rhythmbox on Linux Author : admin I'm using rhythmbox to play music on my Debian Linux. Rhythmbox is a good substitute for both audacious and xmms. XMMS is already very obsolete and it often crashes because of some of it's plugins. On the other hand audacious is sometimes having problems on my notebook working with it's alsa plugin or pulseaudio especially if I play something in youtube. With audacious my songs sometimes got stucked for some weird reason. With rhythmbox I have never experienced this kind of issues. Considering the fact that I'm a GNOME user rhythmbox is even more attractive for me. During about 2 years ago I've heard about the Jamendo - community of free, legal and unlimited music published under the Creative Commons licenses. Just about 10 months ago I've also discovered magnatune which is also a radio which allows free listening online of it's whole online catalogue. That's why it was really interesting for me to have this two nice music streaming services directly into my rhythmbox. I was very happy to discover that already a plugin that embeds the Jamendo and Magnatune Support to the Rhytmbox program. To enable Rhythmbox to support Magnatune and Jamendo type in your root terminal: debian:~# apt-get install gmpc-plugins gmpc-plugins-dbg debian:~# apt-get rhythmbox-plugins It's very likely that the rhythmbox-plugins might be already installed on your Linux, anyways I put the command above just in case if for some reason it's not installed.
    [Show full text]
  • Ubuntu Kung Fu
    Prepared exclusively for Alison Tyler Download at Boykma.Com What readers are saying about Ubuntu Kung Fu Ubuntu Kung Fu is excellent. The tips are fun and the hope of discov- ering hidden gems makes it a worthwhile task. John Southern Former editor of Linux Magazine I enjoyed Ubuntu Kung Fu and learned some new things. I would rec- ommend this book—nice tips and a lot of fun to be had. Carthik Sharma Creator of the Ubuntu Blog (http://ubuntu.wordpress.com) Wow! There are some great tips here! I have used Ubuntu since April 2005, starting with version 5.04. I found much in this book to inspire me and to teach me, and it answered lingering questions I didn’t know I had. The book is a good resource that I will gladly recommend to both newcomers and veteran users. Matthew Helmke Administrator, Ubuntu Forums Ubuntu Kung Fu is a fantastic compendium of useful, uncommon Ubuntu knowledge. Eric Hewitt Consultant, LiveLogic, LLC Prepared exclusively for Alison Tyler Download at Boykma.Com Ubuntu Kung Fu Tips, Tricks, Hints, and Hacks Keir Thomas The Pragmatic Bookshelf Raleigh, North Carolina Dallas, Texas Prepared exclusively for Alison Tyler Download at Boykma.Com Many of the designations used by manufacturers and sellers to distinguish their prod- ucts are claimed as trademarks. Where those designations appear in this book, and The Pragmatic Programmers, LLC was aware of a trademark claim, the designations have been printed in initial capital letters or in all capitals. The Pragmatic Starter Kit, The Pragmatic Programmer, Pragmatic Programming, Pragmatic Bookshelf and the linking g device are trademarks of The Pragmatic Programmers, LLC.
    [Show full text]
  • JAM SE User Guide
    The Music Player Remote Control © 2006-2008 Winfried Klum V1.3 B E T A Overview JAM SE is a free mobile application for a range of Java enabled mobile phones that allows you to control your music collection from your phone, using Bluetooth. JAM SE requires a Server supporting the Bemused Protocol and a PC with a Bluetooth adapter. Browse or search your music collection on your phone, play most files supported by your music player including MP3s, CDs, etc. Control your music player. Pause, stop, rewind, forward your playlist, add songs to the playlist, use shuffle and repeat and control the volume of your player. Browse and select songs in your playlist, download songs to your phone, customize the look of your application with skins. JAM SE Installation Jam SE Server Installation The JAM SE Server Installer contains Server, Mobile Installer, and the jlGUI Music Player. There is no need to configure the setup. After installation you can deploy JAM SE to your phone using the Mobile Installer. Mobile Installer From the drop down box you can choose your phone manufacturer. If your manufacturer is not listed use the 'Other' option. IMPORTANT: If you have already installed an older version of JAM SE, please make sure that you delete the old version from your phone prior to installation. On the next wizard page you can choose your model. If you choose 'Other' you can choose a GENERIC version of JAM SE by screen size. You can choose between two deployment types. Bluetooth deployment is the easiest way to install JAM SE on your phone.
    [Show full text]
  • How-To Gnome-Look Guide
    HHOOWW--TTOO Written by David D Lowe GGNNOOMMEE--LLOOOOKK GGUUIIDDEE hen I first joined the harddisk, say, ~/Pictures/Wallpapers. right-clicking on your desktop Ubuntu community, I and selecting the appropriate You may have noticed that gnome- button (you know which one!). Wwas extremely look.org separates wallpapers into impressed with the amount of different categories, according to the customization Ubuntu had to size of the wallpaper in pixels. For Don't let acronyms intimidate offer. People posted impressive the best quality, you want this to you; you don't have to know screenshots, and mentioned the match your screen resolution. If you what the letters stand for to themes they were using. They don't know what your screen know what it is. Basically, GTK is soon led me to gnome-look.org, resolution is, click System > the system GNOME uses to the number one place for GNOME Preferences > Screen Resolution. display things like buttons and visual customization. The However, Ubuntu stretches controls. GNOME is Ubuntu's screenshots there looked just as wallpapers quite nicely if you picked default desktop environment. I impressive, but I was very the wrong size, so you needn't fret will only be dealing with GNOME confused as to what the headings about it. on the sidebar meant, and I had customization here--sorry no idea how to use the files I SVG is a special image format that Kubuntu and Xubuntu folks! downloaded. Hopefully, this guide doesn't use pixels; it uses shapes Gnome-look.org distinguishes will help you learn what I found called vectors, which means you can between two versions of GTK: out the slow way.
    [Show full text]
  • Development of Cloud-Based Media Player Using Microsoft Azure Services
    eISSN:2600-7920 INTI JOURNAL Vol.1, 2018 (24) Development of Cloud-Based Media Player using Microsoft Azure Services Chong Fong Kim1, Chan Yong Kai 2 and Deshinta Arrova Dewi3 1,2,3 Faculty of Information Technology and Science, INTI International University, Nilai, Negeri Sembilan, Malaysia. Corresponding Author: [email protected] Abstract Playing songs offline consumes internal storage capacity of a device. Besides, playing songs, most of the time is an individual acting as a hobby and many song listeners do not have a common platform to share their hobby with others. By putting it on the cloud, the internal storage capacity can be reduced and the chance to share the common hobby with others is available. This paper aims to present the development of a Cloud-Based Media Player (CBMP) to ease the users in managing their song files and sharing with others. The CBMP utilizes a website as the main controller and connects to the Microsoft Azure Services to host the music database. Two separate sections are created for the user to upload and download their songs as private and share sections. Accordingly, users can choose the favored section they want to access. Not only features to upload and download songs are provided, but the CMBP also provides a search function that enables users to search songs in both different to make a search process faster. Due to latency in the cloud services, the suggested song format for CMBP is.MP3 files. The .MP3 files promote better compression rate than .MP4. Besides, .MP4 has higher latency that makes users waiting longer for processing the songs.
    [Show full text]
  • The Glib/GTK+ Development Platform
    The GLib/GTK+ Development Platform A Getting Started Guide Version 0.8 Sébastien Wilmet March 29, 2019 Contents 1 Introduction 3 1.1 License . 3 1.2 Financial Support . 3 1.3 Todo List for this Book and a Quick 2019 Update . 4 1.4 What is GLib and GTK+? . 4 1.5 The GNOME Desktop . 5 1.6 Prerequisites . 6 1.7 Why and When Using the C Language? . 7 1.7.1 Separate the Backend from the Frontend . 7 1.7.2 Other Aspects to Keep in Mind . 8 1.8 Learning Path . 9 1.9 The Development Environment . 10 1.10 Acknowledgments . 10 I GLib, the Core Library 11 2 GLib, the Core Library 12 2.1 Basics . 13 2.1.1 Type Definitions . 13 2.1.2 Frequently Used Macros . 13 2.1.3 Debugging Macros . 14 2.1.4 Memory . 16 2.1.5 String Handling . 18 2.2 Data Structures . 20 2.2.1 Lists . 20 2.2.2 Trees . 24 2.2.3 Hash Tables . 29 2.3 The Main Event Loop . 31 2.4 Other Features . 33 II Object-Oriented Programming in C 35 3 Semi-Object-Oriented Programming in C 37 3.1 Header Example . 37 3.1.1 Project Namespace . 37 3.1.2 Class Namespace . 39 3.1.3 Lowercase, Uppercase or CamelCase? . 39 3.1.4 Include Guard . 39 3.1.5 C++ Support . 39 1 3.1.6 #include . 39 3.1.7 Type Definition . 40 3.1.8 Object Constructor . 40 3.1.9 Object Destructor .
    [Show full text]
  • The Top 10 Open Source Music Players Scores of Music Players Are Available in the Open Source World, and Each One Has Something That Is Unique
    For U & Me Overview The Top 10 Open Source Music Players Scores of music players are available in the open source world, and each one has something that is unique. Here are the top 10 music players for you to check out. verybody likes to use a music player that is hassle- Amarok free and easy to operate, besides having plenty of Amarok is a part of the KDE project and is the default music Efeatures to enhance the music experience. The open player in Kubuntu. Mark Kretschmann started this project. source community has developed many music players. This The Amarok experience can be enhanced with custom scripts article lists the features of the ten best open source music or by using scripts contributed by other developers. players, which will help you to select the player most Its first release was on June 23, 2003. Amarok has been suited to your musical tastes. The article also helps those developed in C++ using Qt (the toolkit for cross-platform who wish to explore the features and capabilities of open application development). Its tagline, ‘Rediscover your source music players. Music’, is indeed true, considering its long list of features. 98 | FEBRUARY 2014 | OPEN SOURCE FOR YoU | www.LinuxForU.com Overview For U & Me Table 1: Features at a glance iPod sync Track info Smart/ Name/ Fade/ gapless and USB Radio and Remotely Last.fm Playback and lyrics dynamic Feature playback device podcasts controlled integration resume lookup playlist support Amarok Crossfade Both Yes Both Yes Both Yes Yes (Xine), Gapless (Gstreamer) aTunes Fade only
    [Show full text]
  • Development Environment for the Raspberry Pi Using a Cross Compiling Toolchain and Eclipse | Hertaville 07.10.13 13:37
    Development Environment for the Raspberry Pi using a Cross Compiling Toolchain and Eclipse | Hertaville 07.10.13 13:37 Hertaville Welcome to Hertaville! Development Environment for the Raspberry Pi using a Cross Compiling Toolchain and Eclipse Posted on September 28, 2012 by halherta UPDATED July 15th 2013 In this blog entry the setup of a cross-compiling development environment for the Raspberry Pi will be demonstrated. This will include the Official Raspbian (armhf) cross compiling toolchain (available from github) Eclipse for C/C++ Developers (Linux) We will finally write a simple Hello World program on our development PC, compile it using the cross compiler and then deploy it onto our Raspberry Pi board to run it. I’m going to assume that you have already installed a Raspbian Wheezy image on your RPi board and that you have Linux installed on your desktop PC. For this tutorial I am using the Crunchbang 11 Linux OS (64-bit) on my PC. The instructions provided should work on most Debian/Ubuntu based Linux distributions running directly on a PC or as a a guest operating system via VMWare/ VirtualBox . A remote debugging tutorial; which I consider to be the continuation of this tutorial, can be found here. Finally, Derek Molloy has a great video tutorial on setting up a similar environment for the Beaglebone. Watching this video was incredibly informative and helped me set up this tutorial. So what is a cross compiling toolchain and why use one ? A native compiler such as the default gcc tool on the PC is a compiler that runs on an Intel machine, as well as creates binaries intended to be run on an Intel machine.
    [Show full text]
  • Drawing in GTK+
    CSci493.70 Graphical User Interface Programming Prof. Stewart Weiss Drawing in GTK+ Drawing in GTK+ Background In order to understand how to draw in GTK, you rst have to understand something about how GTK draws widgets, because how GTK draws widgets has an important role in how you design your drawing application. An understanding of how GTK draws widgets is also required if you ever plan to build your own custom widgets. Windows and Clipping Most windowing systems are designed around the idea that an application's visual display lies within a rectangular region on the screen called its window. The windowing system, e.g. Gnome or KDE or Explorer, does not automatically save the graphical content of an application's windows; instead it asks the application itself to repaint 1 its windows whenever it is needed. For example, if a window that is stacked below other windows gets raised to the top, then a client program has to repaint the area that was previously obscured. When the windowing system asks a client program to redraw part of a window, it sends an exposure event to the program that contains that window. An exposure event is simply an event sent from the underlying windowing system to a widget to notify it that it must redraw itself. In this context, a "window" means "a rectangular region with automatic clipping", not a top-level application window. Clipping is the act of removing portions of a window that do not need to be redrawn, or looked at the other way, it is determining which are the only regions of a window that must be redrawn.
    [Show full text]
  • Gtk Marries Ada: the GUI Technology Revolution
    GtkGtk MarriesMarries AdaAda:: TheThe GUIGUI TechnologyTechnology RevolutionRevolution [email protected] OverviewOverview History of GtkAda GtkAda Features Why Gtk Rather Than Other Toolkits? Why GtkAda rather than Gtk+? GtkAdaGtkAda -- HistoryHistory á The GIMP – GNU Photoshop clone á The Gtk+ library – Becomes independent á GtkGlade: a Gtk+ GUI builder á Gnome: a desktop manager á GVD: the GNU Visual Debugger GtkAdaGtkAda FeaturesFeatures ááHigh-level binding to the Gtk+ library – object-oriented – type safety – small and efficient ááHighly portable – Unixes: Linux, Solaris, … – Windows NT ááNative GtkAdaGtkAda FeaturesFeatures (2)(2) ááEvent handling ááDrawing services – Lines, rectangles, … – OpenGL (3D graphics) ááStyle support ááLarge set of widgets GtkAdaGtkAda -- WidgetWidget setset á Two types of widgets – containers and visual objects á About 100 widgets are provided á High-level widgets – notebook, text widget, tree, spin button, table, toolbar, ... GtkAdaGtkAda -- ScreenshotsScreenshots á Ctree GtkAdaGtkAda -- ScreenshotsScreenshots (2)(2) á OpenGL WhyWhy Gtk+?Gtk+? á Portable á Native á Extensible á Open Source á Actively developped á Thread-safe WhyWhy Gtk+?Gtk+? (2)(2) á High level widgets á Easy to use scrolling capabilities á Wide range of users á Very powerful layout capabilities – Complete set of containers á Powerful and easy to use GUI builder á Easy to bind TheThe GUIGUI BuilderBuilder ááMulti-language GUI builder – Language-independent save file (XML). – Code-generation specific to each language. – Dynamic loading
    [Show full text]
  • Installing a Real-Time Linux Kernel for Dummies
    Real-Time Linux for Dummies Jeroen de Best, Roel Merry DCT 2008.103 Eindhoven University of Technology Department of Mechanical Engineering Control Systems Technology group P.O. Box 513, WH -1.126 5600 MB Eindhoven, the Netherlands Phone: +31 40 247 42 27 Fax: +31 40 246 14 18 Email: [email protected], [email protected] Website: http://www.dct.tue.nl Eindhoven, January 5, 2009 Contents 1 Introduction 1 2 Installing a Linux distribution 3 2.1 Ubuntu 7.10 . .3 2.2 Mandriva 2008 ONE . .6 2.3 Knoppix 3.9 . 10 3 Installing a real-time kernel 17 3.1 Automatic (Ubuntu only) . 17 3.1.1 CPU Scaling Settings . 17 3.2 Manually . 18 3.2.1 Startup/shutdown problems . 25 4 EtherCAT for Unix 31 4.1 Build Sources . 38 4.1.1 Alternative timer in the EtherCAT Target . 40 5 TUeDACs 43 5.1 Download software . 43 5.2 Configure and build software . 44 5.3 Test program . 45 6 Miscellaneous 47 6.1 Installing ps2 and ps4 printers . 47 6.1.1 In Ubuntu 7.10 . 47 6.1.2 In Mandriva 2008 ONE . 47 6.2 Configure the internet connection . 48 6.3 Installing Matlab2007b for Unix . 49 6.4 Installing JAVA . 50 6.5 Installing SmartSVN . 50 6.6 Ubuntu 7.10, Gutsy Gibbon freezes every 10 minutes for approximately 10 sec 51 6.7 Installing Syntek Semicon DC1125 Driver . 52 Bibliography 55 A Menu.lst HP desktop computer DCT lab WH -1.13 57 i ii CONTENTS Chapter 1 Introduction This document describes the steps needed in order to obtain a real-time operating system based on a Linux distribution.
    [Show full text]