 Ffliw gofo'r droll. So, byddwch yn ychydig. Yn ymgylchedd eraill o'r ystodau o'r adnod i'ch wahanol i niadr wrth i'w mwyaf gyda'r Llywodraeth Cymru. Fel os rydw i chi'n ddim yn ddim yn wahanol ar gyfer fynd i chi'n fath o'i gweithwyr gan i'r cyflwyno cyntaf ddechrau i'r rhodoedd llwythydd yn y Llywodraeth Cymru. Ieithi gŵl o'r sgol i'r newestep yn ystod, mae'n oed yn gallu gweithio y gŵr ymgyrchol ei wneud. Ieithi gŵl o'r newestep yn rhan o'r sy wedi'i gŵl o bobl? Ieithi gŵl o'r sydd yn gwneud o'u gwneud o'r maithau yn gweithio ymgyrchol? Ieithi gŵl o'r newestep yn ystod i'r newestep, felly mae'n gŵl o'r fwylo sy'n gwneud o'r fwylo. Mae'r hyfforddiadau, os gallwch ein gweithio ar gycheg o'r hunain gofynag gan glasgrunau. Mae'r hyfforddiadau ar gweithiwch ar ei ddedig am bobl a'u mewn cramgellau ddechrau. Mae'r mynd i ddylch interu wahanol, ond y ffordd i'r greu ymlaen. Mae'n ei wneud yn oed o'rndeych chi'n arwm nourrach a'r hyfforddiadau. y cwyl ceisio'i cyfnodol, mae phobl i'w £4 i gael ei bob gweithio'r cyfnodol, mae yma'r ymwêl i'w dyn nhw i gael y cyfnodol. A symud y ffóorau cyfnodol mae ffóorau yn gweithio'r cyfnodol sy'n cyfnodol iawn y wneud. A gwinelliaid â'r mynd i. mae'n mynd i'r ddafnwys. Mae wnaeth beth sydd wedi gyda llof i ymdweud. maen nhw fydd ffast. I have to be able to maintain all this clearly in ouratory ways. So, how do we make the theme easy for people to use? Well, we make it a standard well-defined package, something that can easily copy from place to place. You don't have any problems installing that. We provide an easy way to select a theme so that people can just play around trying on the different themes available. We make the theme update instant so that you're running applications rydych chi'n cael ei dylai耗. Rydych chi'n cael ei rhaglenio ein ffordd cofarlorei, nid yw'r ddweud ddim yn ei dycofalo, e'w ddweud i'w dei ddweud o hynny, i ffwg i ddweud o ddweud, creu bod yna'r ddweud yna i ddweud o ddweud, ydw i ddim yn gwnewch yn eu ddweud o ddweud. Dwi gydweithio'r ddweud o ddweud o'r ddweud, rydych wedi gweithio ar erioedd yn i fynd drwy'n i'w ddweud o gyrdd cheilio'r ac oedd yn gwneudienen o amser, oni wedi cael ei gweld y cym sectorthau i gefnogi yw'r cyfodol yn gweithio'r cyflog. Mae'n wneud o'n gweithio'r cyflog yn y formi a'r cyflog yn gyfle i ym Hellydd Cymru. Alrhaeg yn gweithio'r cyflog yn gweithio ar gyfer y llunedd cyflog yn cerddwynt ac yn cynhyrchu'r cyflog not to write any additional code. Sometimes you do have to write additional code though when we do that we need to support versioning because you want to make sure that the direct version of your executable is loaded into the system. One of the ways we're looking at doing things is by tidling images onto individual controls so that you're building a theme out of individual pictures. Felly, we need to have a nice simple mechanism to define those tiles. I chose to use a single image and divide it up. So you design your button and design which parts of it are going to go where. For the developer, we have to keep the number of methods to a minimum to keep it simple. That's a lot harder than it sounds. We need to put as much code into the GUI library to make it as standard built in as possible so that the developer doesn't have to re-write stuff if possible. We organise things in a clean and simple way with related stuff written together. And we'll try and document it. So, how did we actually decide to do it? It's going to be a slow incremental process of getting theming working perfectly instead. We're just partway there for the moment, really. So, we need to build a theme engine and the tool to design themes in parallel so that as you develop one feature in the theme engine, you've got the tool to try it all around. We need to use as much of the existing theme for functionality as possible and that's actually quite a lot of them instead. We need to design it from the very beginning. Instant switching is good things, dynamic update. And we just use the ideas from Chameleon. That's a theme engine produced by the Etoile project. Basically, their concept was tiling for everything. Define rectangles, define the images that fill those rectangles with various controls in the GUI. Draw themselves using those rectangles to tile their left top corner, bottom right corner, filling things in between. And we have to provide theme methods that a coder can actually override so that they can say, right, I don't like the way this is drawn by fault. I'm going to do it completely differently. Okay, the existing theming stuff. The new step has pretty much always provided system images. That's things like the arrows in menu items, icons for file buttons for when you're at a load from a file system, that kind of thing. So we can reuse that mechanism in the new theme API. What we do is we replace the named system images that are built into the system with versions from a particular theme. And when the theme is deactivated, we just revert to the originals. System colors. Much the same system images. The OpenStack API provided a color list, a list of named colors that the system uses. So it has something saying highlighted control control, that's being highlighted. When a control draws itself, it looks up one of those colors right now. All we do is replace that color list when a theme is activated so that new colors will be used throughout and restore the list when a theme is deactivated. We always deactivate the Open before activating a new one and that kind of avoids confusion. System fonts. Again, the NewStep API provides a whole list of standard fonts by name and standard font sizes by name and uses those to decide how text is going to be displayed in the various different controls. The user default system specifies which name maps onto which actual font and which real size. We could have a theme changing all that sort of stuff. Haven't done it yet. NSInterface style. That's a mechanism that was introduced by OpenStep many years ago to control the style of the interface. They used it for changing the style of applications between Next Step and Next Step running on Microsoft Windows. It's a simple mechanism where you tag several different style names for different behaviors. When you set a particular interface style for a control then that control will draw itself differently and you've got hard code of drawing mechanisms in there to do the different look and feel. Because it only lets you switch between well-defined styles that are already built into the low-level library it's too limited for general thinking that we can use it to switch between standard behaviors such as menus. The Next Step menu is a vertical menu on the top left corner of the screen. MacOS menu appears all the way across the middle of the screen and Windows menu appears within a window. The user default system in OpenStep is a really major component that allows you to define a database of lots of different information and that includes fonts, colours, all that sort of stuff. But we can extend it to add more behaviors. A default to control whether we have the applications draw the window decorations in the top bar of the window or the window that can play or whether we let the window manage it. We can actually use that to control all sorts of detailed individual behaviors if we decide we want them. So what's new in the new thinking system? Well, we can set any colour to be used by a control individually rather than using the system colours list. So we've got more fine-grained control there. We can set the interface defined style for the individual controls and parts of controls. Now that's always been possible via the default system but using the default system is kind of inconvenient. Most users have trouble doing it. They don't know what defaults they can set. They don't know what the possible values there are. So having the thinking system do that simplifies it enormously. Setting tile images to be used for a control. That's totally new and adopted from the communion thinking system. And of course, overriding the individual methods used to draw a control. So a control instead of drawing itself by using low-level mechanisms that's a standard part of the drawing model will use specific methods as a part of the thinking system instead. So tile images. I've already said this from communion. And main tricks are up to nine images. So we can have say two rows of three images or two colours of three images or even just four images but up to nine so that would define a rectangle with top left corner, top right corner, bottom left corner, bottom right corner. Then the image in the middle can be tiled repeatedly to fill however wide a control is. The image in the middle on the vertical axis would be tiled to fill up the border on a larger control. And the middle part is either tiled repeatedly to fill a control or scaled up to fill a control or just admitted because this is something that you're going to draw in the middle part with something else and you're only using the tiles for the border. So that concept of a metrics of nine images really works very well to draw a standard simple control that's not made up of other parts. If something's made up of other parts obviously you have multiple sets of tile images for each of those sections. Yes, we use a single image, I think I mentioned that. The idea is that we actually let people design a single image and they can do that in any sort of drawing package and produce a nice looking image for what they want the thing to look like in the longer. Then they go into the filling application of that image and specify where that's sliced up into nine sections. It makes it easier to design the nine parts of the tile and use a theme selection. User defaults are too obscure. It's actually quite simple to set a theme using user defaults. You just set a user default to specify the theme there but who wants to do command line stuff like that? So what we did is we extended the info panel that all the new step applications use pretty much. There's a standard mechanism within the API for creating an info panel. All we do is extend that standard mechanism so that it shows the current theme at the bottom of the list of all the other information about the application. Clipping on the name of that theme brings up the theme panel which is the icons of all the themes on the left and lets you select on an individual and click on an individual theme to select it. Once you select a theme, it displays the information about who the author was, when it was written, any other information that the author wanted to put in there and obviously changes the way your application looks. There's also a button on that panel that lets you make this selected theme be the default for your application. That's the design application. It should be usable to tweak things because we wanted to be nice and simple for people who just want to mess around with their things but mostly it's designed for the actual theme designer. The person who's going to write a theme from scratch is going to put new versions of various different controls and then systematically change colours on that panel. It has to provide easy ways to replace the system images to specify replacement colours to set the menu style, to set the decoration behaviour, to set all sorts of individual information. The GS theme class is actually built into the GUI library and the library uses for drawing. The basic class is responsible for handling loading a new theme from a bundle and that includes loading in your executable code if you're overriding individual methods to draw things together. It controls the switchover between themes, that process of deactivating one theme and activating another. It handles all the actual changes in the mechanism of introducing the new system colours and the new images and changing the user defaults. And it provides methods to obtain all the different resources that you use to draw your controls. And it's designed to be efficient. So it uses load-on to land caching, and nothing in there. None of those big resources like the images are actually loaded into memory unless they're used. At the load they're used, they're cached. They stay in memory for the duration that that theme is active. And look up for them. It's just extremely quick. The activation process. We start off when we activate a theme by sending a notification to say that the theme is going to activate. That allows anything else in your application to do any work it needs to do to handle that theme activation. So some of the Huey classes will observe that notification and will change the way they behave when they see a new theme being activated. But also, user code can handle that. So if an application wants to be able to deal with them in a more intelligent way, it can use the notification as to do that. Once we've sent that notification to say we're going to activate a new theme, we change the user defaults database system colours system colours. We change the current theme, which is a global variable, essentially. So that everything can use this new theme instance, this new object. We update the main menu of the application, because that's a kind of complicated bit where we have to reorganise the menu if we're changing from a horizontal layout to a vertical layout, that kind of thing. And we send another notification telling everything that the activation has completed. That's the point when all the windows can redraw themselves to take on the new appearance. Thing to Activation is pretty much a reverse of that. We send a notification to say that it is stopping. Remove all the images, remove the current theme instance, revert to the original one, which might be, or will generally be built-in one. I look at the same notification to say we've completed it. Right. I put in a whole section on this, because it is an important detail that we don't override the default system when we introduce a new theme. Almost all of this standard theming mechanism, all the old stuff, certainly, is controlled by the user default system. We avoid overriding what everyone else has set there. So we set our new defaults in a default domain that's at the bottom of the list that's looked at consultancy last. I don't know if everyone's familiar with the default system, but basically you have different domains that you set defaults in, and you have a list of domains, and when you want to look at the value of default, it goes down the list, finds the first match. So the matches produced by the themes are always the last matches, and someone else can tweak things by setting individual defaults. I don't know if that's the right decision, but that's the way it works for the moment. Okay. Low-level drawings for things. This is a whole new section of the GSP class still. We provide utilities to do things like tiling of a rectangle, drawing borders, drawing the central part. All the sort of basic drawing functionality that you need to use within your theme methods if you're going to be writing a theme and you're going to be overriding individual methods. This is the toolkit of things that you can use to do simple drawing. You can always use the very low-level API, the NSB to get past that kind of stuff, but it's simpler. The main API for the theme, if you're going to actually implement new controls in the theme system, it's as... I'll start again. We have a list of methods that are essentially designed for drawing specific controls. So, for instance, the button has a few methods that allow it to draw itself using the theme API rather than using low-level mechanisms. We override those in the thematic.app. It lets you add new code to your theme that will override those methods. And the controls call them to call themselves. So, these methods use the tiles, the interface styles, and the images that are provided by all the standard thinking mechanisms. If none of those overrides that let you theme things, if the tiles aren't there, the colours aren't there, that sort of thing, it always falls back on the original hard-coded gymwsteth style. Named items are a fairly important concept in the theme system. It's not enough to change the look of all the controls in a particular class. The reason for that is that a particular class of control is used in different contexts. Buttons, for instance, are used throughout the system, and you won't necessarily want the buttons to look the same everywhere that they're used. So, the OK button in your open panel, maybe all the OK buttons, want to look different from most other buttons. The way we handle that is that the enclosing control so the open panel, for instance, when it creates a button in itself, it also can assign a name to that button. Basically, it registers that name with the current theme object. That allows the theme designer to then provide resources specific for that individual button rather than all buttons. Right, current state of development. OK, the framework exists. It's useful. You can create things with the application. The system image assistant colours interface-style information. All that old stuff is there built into the theme system, easily set up. The GUI library controls need to be converted to use the drawing with methods from the theme API to use the named items and the named covers and the name of the tiles. Currently, NS Sprel View are all switched over to using the theme API, but there's plenty of work still to be done on other controls. I suppose the NS menu really is controlled by the API as well. So the look of the main menu. We need volunteers. In future, we need, first of all, people to actually start using this to design some nice themes. Partly because we want to have some nice themes. Partly because that can show any shortcomings. We need to continue the process of looking at the individual GUI controls that haven't really been themed yet and to find the methods that we're going to use to draw those. These are the bigger methods that are added to the current theme API. We need to obviously update those controls to use those methods, update the thematic application to support those changes. We should support setting system fonts. There's not been any call for it yet, but I'm sure at some point in the future people will want that. I think that's the end. Now, the obvious thing to do at this point is to try a demo enigmatic. My screen here. Maybe you can kill an excellent anti-wist art. You can do that up. Now the subtle word again. Yes, I should do it. Will that not be sized screen again? Thank you. So I had to borrow this. I don't have an adapter for my computer because of the projector. Looks good. Let's try to start the thematic application. OK. I can create a new theme. I want you to see when you create a theme. First of all is your your main window for that theme editor. Up here we have system colours. That's quite straight forward. It's not the most... Anyway, the system colours inspector lets you select which system colour you want to change. And then you can use a colour world to pick a particular system colour, say. So the control highlight colour might have changed to yellow. Control background. It's in an instant effect of setting a red background colour for all the controls. Pretty ugly, but it illustrates a point. Then we have the system images. That inspector you get all the different standard images so you can find the image you want to change. That one. And double click to get up an open panel to select the image you can actually have on just if you want to replace it. The menu inspector lets you, for instance, select between menu styles. So now we have a horizontal menu bar at the top and a vertical menu bar again. What are the constraints for a horizontal menu? Constraints, in what sense? What happens if there are more menu items than on the screen? I have the faintest idea, to be honest. I don't know, we've had that for quite a while actually come across that in practice. We had a discussion about what we were going to do for in window menus. We've just recently added Microsoft style in window menus and of course windows were a lot shorter, so it's actually a real problem in that case. In that we're quite likely to have menus where the number of items won't fit across the width of the window. I think what we decided to do there is have a submenu produced at the right hand side if there were two little states. So you click on that submenu and then get a vertical menu for the extra items. But that's not yet implemented. Windows decorated natively or decorated I think. Unfortunately, that's the one thing that doesn't yet work immediately on the fly. You have to exit from the application again. The reason for that is because the window decoration stuff is tied in with the back end as well as the front end library. We've had to change all the back ends as well as changing the GUI to implement that. So let's take a little time. Final one along here. That's miscellaneous stuff. It's where you set who's the author, any additional information you want on the thing. Change the icon for the thing. That kind of thing. Just quick close that one. And open an existing one. Now, thanks to Ricardo for this one. He didn't want me to show this. It's an old version of this Windows theme. Actually I've properly modified it a little so he's not even responsible for all the mistakes. Facts is I didn't have anything, didn't have time to lock up anything myself. I lost it. It broke. Oh well. I just have an image there. OK, so here's an example of an image setting the timing for it. So if you've watched the button on the main menu, as I changed the position that I cut this image. He says to be always in position. It does in this at the moment. The backend API doesn't require it to be symmetrical. The thematic application does. Anyway, you can see the effect of changing these positions. Basically we're drawing the border around the outside in this button using this image. We don't have that here. I should go back to so I realise I just went along the top system colours, system images, menu, window and miscellaneous. The rest of this space in the rest of the space here in this area is for other GUI controls. The idea is that you're going to go on a thematic and just drop other controls in here. So at the moment we've got a button right in here. There's a scroll view with a couple of scrolls. Now, if you click on one of those your theme inspector comes up with a whole lot of different options. So first of all this tiling you can see the control. Click on there and you can select an image to use for tiling. You can select. In the case of the scroller different named items here. So the scroller down arrow is one of those named items that is specific to the scroller. Select the down arrow and say select a different colour for the scroller down arrow. There you go. Only affect the scroller down arrow. I could also, for instance, set a different colour for the scroller for example, long. So you can customise each individual control. Set the tiles to draw it. Set the colours. You can set options if they have them. This one does. I've forgotten about that. Well, that's good. So you can have arrows at the same end of the scrollbar or at the specific scrollbar. That's very important. Yes. Just a quick question. Are these colours always all back or are these a part of the strategy? They're not. Okay. In fact, the Ricardo's one that we just looked at was not okay. Okay. So you can have all of our values for the colour. In the future as well? You have an effect chain in your future to have a custom border in your confidence? You go, yes. Now, of course the final thing is codes. You actually want different code. There are various things you can include in your code. In extras that you need. So if you want to add common methods that are shared by different methods within your theme or include extra non-headers, for instance we are going to be doing a windows theme which will want to use the windows theming API which means we're going to need to include their headers. Global variable declarations, additions to a makefile to build it on. One of your actual theme methods for a button in view of a particular style for a particular state. So if you click on edit for that you get up a template method that just invokes the super class implementation. These template methods are all when in fact all these settings in the thematic are defined in property lists text property lists in files in the thematic application. So most of adding a new control is very easy you just change those text files. But anyway if for instance I want to put some more code in here maybe I won't bother putting any code in here. If I was to put code into here and click on done it would automatically compile that and put it into the theme. I don't know that would be kind of fun to do. So you handle only solid code also? Can you also handle some gradients and predefined patterns? We don't have gradients and patterns in there. We have just colors and we have tile images I think you can handle that. Any gradient should be imperative using a gradient every time? Not necessarily. A gradient could be implemented using a tile image or it could be implemented using a code you just override the method to draw the gradient. At some point in the future we might add gradients as an option controlled by the user default option but we haven't done that yet. Really? That covers it? Questions? What happens if you enter code, invalid code and the code editor is out of interest? Then it will give you a compiled error I'll see if I can do that. The mouse is a bit sensitive so if I just enter some rubbish there hopefully, yeah we'll get that. Of course you can delete. You've made a mistake. That's kind of easy. We'll get back to that. Does somebody try to convert the gradient theme to the new gradient step theme? No. That's probably a good idea to do but... I mean it would be nice to have that mouse with the gradient guys if they ever move through there. Yes I don't actually think there are very many comedian themes yet. At least two or three though which is a lot more than we have in the way of proper themes. I don't need one, I really like it. I prefer it all of it all the time though. Anything else? More questions? I have no idea what the time is. It's about 5 minutes. It's about 5 minutes. Will those themes be compatible for with other theming engines what they use? Somehow. Nice. The way we're going to make things compatible with other theming engines is to actually get in and write code based things. Most of this is designed on the assumption that what we have using the application is a theme designer. Someone who's interested in the graphics and who's artistic and knows nothing about coding quite often. If we want to integrate with Windows which we do or KDE or something like that then we're going to have to use their native theme engines in a way we have to do that. It's to go into the code level to use their theme engines from within our code. We can do that in two ways. If it's reasonably possible we can use their theme engine to draw into our cues directly. Directly draw the controls. Where that's not possible because their theme engine doesn't work that way what we can do is use the theme engine to draw into a background window and then take the contents of that window as an image picks that and use the tiling mechanism to draw that within our things within our controls. It's a roundabout way hopefully we don't have to use that but it's a fallback option. So yes the intention is to write some things to look like other systems. You said you wanted to keep the developer API fairly simple at least methods possible but at the moment you've only implemented a button with scroll bars and things. Yes. How do you envisage keeping it simple as well as having those controls specifically made as well? Because you've got like Zoom checkboxes and radio buttons and they all have their own they all have their own unique methods. Well no. Hopefully most of them won't because actually most of those things are implemented pretty much as buttons and can be drawn very easily using the tiling mechanism. So the vast majority of cases what we already have will do the job for them. What we have to look at are the more complex controls like where you want a whole panel that contains a browser and various buttons and things to behave differently. One possibility because of the nature of Objective C is that we never provide them for the very very big complex controls directly. We say you add a mechanism to replace a control class drawing that draws itself with a subclass that's completely different than what it has. So we could add a simple API just to effectively replace the classes with another version for those controls. So that should keep it let us keep the count down. We've got generic stuff that should work very well for all the simple controls. Then we've got a simple mechanism for people to override very complex controls that really need to be done completely differently. What we're really aiming to do is keep down the count of methods that are in the middle that don't really fit into either of those to extreme camps. So your checkbox and radio buttons they'll use the draw button method plus they'll have a different image of them. We've all been selected somehow with an active parameter. They already use system images for instance. The checkbox uses so they have named images already and you just pick the image, replace it in your thing before the checkbox changes its behavior. Before named images you can type this theme and replace the button which is the mother class almost every part of the using it has changed because so many items are buttons that everything got a window button so that's the point where the image is necessary. Yep. OK. I hope that we can get ready for next selection.