GNOME Bugzilla – Bug 735419
Hi DPI scaling for profile pictures on login
Last modified: 2014-10-07 00:07:43 UTC
Bug: When using a HIDPI screen the profile picture at the login screen does not scale with the text as expected. Steps to reproduce: Attached HIDPI screen and boot computer. At login note the inconsistency between 'normal' DPI and HIDPI screen and the profile picture size Expected behaviour: Profile picture size looks similar to non-high DPI screen (i.e. larger than user name on login). I can attach a photograph if required. Many thanks.
(In reply to comment #0) > Bug: > When using a HIDPI screen the profile picture at the login screen does not > scale with the text as expected. > > Steps to reproduce: > Attached HIDPI screen and boot computer. At login note the inconsistency > between 'normal' DPI and HIDPI screen and the profile picture size > > Expected behaviour: Profile picture size looks similar to non-high DPI screen > (i.e. larger than user name on login). > > I can attach a photograph if required. Many thanks. Hello Darcy, I'm Ron This is a bit ticky...lol .I had the same problem in gnome and in gdm To fix gdm: Become Root sudo -i Allow gdm to use the screen xhost +SI:localuser:gdm Login as gdm su gdm -s /bin/bash Copy and paste the following gsettings set org.gnome.desktop.interface scaling-factor 1 Type: exit SAVE AND CLOSE ANY WORK AND OR RUNNING APPS Type: shutdown -r now For the scaling factor in gnome: Issue the below command in a terminal as a normal user gsettings set org.gnome.desktop.interface scaling-factor 1 Or install dconf-editor sudo apt-get install dconf-editor Open Dconf and browse to: org.gnome.desktop.interface change scaling-factor from 0 to 1 Close and save Open Work: sudo shutdown -r now
Hi Ron, Thanks for the reply. I couldn't get your first instructions to work for the gdm. Is this reverting the screen back to 1 times scaling? If so, this will make my laptop horrible to work with with tiny fonts. Thanks.
Created attachment 286249 [details] Photographic evidence See small profile in comparison to other UI elements.
i think this might be a side-effect of the way we achieve the rounded frame around the icon (by making the icon be rendered as a background image), but not sure. need to investigate. regardless, the profile image is rendered by gnome-shell (userWidget.js) not GDM, so correcting component.
Hi Ray. Great, thanks for your response. I updated to reflect the bug also occurs in GNOME 3.14.
So after compiling Gnome shell, I had a look in userWidget.js. Naively I changed the avatar size to 64*2.0 (const AVATAR_ICON_SIZE = 64*2.0;) and that fixed the problem of the small login picture. I suppose now I need help with whatever member call is required to grab the screen scaling and that's job done. Unless you can point me in the direction of where I can find that I can submit my first open source contribution!
Created attachment 287788 [details] [review] Included scale_factor in avatar size, consistent with previous usage
Comment on attachment 287788 [details] [review] Included scale_factor in avatar size, consistent with previous usage >// -*- mode: js; js-indent-level: 4; indent-tabs-mode: nil -*- >// >// A widget showing the user avatar and name > >const Clutter = imports.gi.Clutter; >const AccountsService = imports.gi.AccountsService; >const GLib = imports.gi.GLib; >const Gio = imports.gi.Gio; >const Lang = imports.lang; >const St = imports.gi.St; > >const Params = imports.misc.params; > >let scaleFactor = St.ThemeContext.get_for_stage(global.stage).scale_factor; >const AVATAR_ICON_SIZE = 64*scaleFactor; > >// Adapted from gdm/gui/user-switch-applet/applet.c >// >// Copyright (C) 2004-2005 James M. Cape <jcape@ignore-your.tv>. >// Copyright (C) 2008,2009 Red Hat, Inc. > >const Avatar = new Lang.Class({ > Name: 'Avatar', > > _init: function(user, params) { > this._user = user; > params = Params.parse(params, { reactive: false, > iconSize: AVATAR_ICON_SIZE, > styleClass: 'framed-user-icon' }); > this._iconSize = params.iconSize; > > this.actor = new St.Bin({ style_class: params.styleClass, > track_hover: params.reactive, > reactive: params.reactive, > width: this._iconSize, > height: this._iconSize }); > }, > > setSensitive: function(sensitive) { > this.actor.can_focus = sensitive; > this.actor.reactive = sensitive; > }, > > update: function() { > let iconFile = this._user.get_icon_file(); > if (iconFile && !GLib.file_test(iconFile, GLib.FileTest.EXISTS)) > iconFile = null; > > if (iconFile) { > let file = Gio.File.new_for_path(iconFile); > this.actor.child = null; > this.actor.style = 'background-image: url("%s");'.format(iconFile); > } else { > this.actor.style = null; > this.actor.child = new St.Icon({ icon_name: 'avatar-default-symbolic', > icon_size: this._iconSize }); > } > } >}); > >const UserWidgetLabel = new Lang.Class({ > Name: 'UserWidgetLabel', > Extends: St.Widget, > > _init: function(user) { > this.parent({ layout_manager: new Clutter.BinLayout() }); > > this._user = user; > > this._realNameLabel = new St.Label({ style_class: 'user-widget-label', > y_align: Clutter.ActorAlign.CENTER }); > this.add_child(this._realNameLabel); > > this._userNameLabel = new St.Label({ style_class: 'user-widget-label', > y_align: Clutter.ActorAlign.CENTER }); > this.add_child(this._userNameLabel); > > this._currentLabel = null; > > this._userLoadedId = this._user.connect('notify::is-loaded', Lang.bind(this, this._updateUser)); > this._userChangedId = this._user.connect('changed', Lang.bind(this, this._updateUser)); > this._updateUser(); > > // We can't override the destroy vfunc because that might be called during > // object finalization, and we can't call any JS inside a GC finalize callback, > // so we use a signal, that will be disconnected by GObject the first time > // the actor is destroyed (which is guaranteed to be as part of a normal > // destroy() call from JS, possibly from some ancestor) > this.connect('destroy', Lang.bind(this, this._onDestroy)); > }, > > _onDestroy: function() { > if (this._userLoadedId != 0) { > this._user.disconnect(this._userLoadedId); > this._userLoadedId = 0; > } > > if (this._userChangedId != 0) { > this._user.disconnect(this._userChangedId); > this._userChangedId = 0; > } > }, > > vfunc_allocate: function(box, flags) { > this.set_allocation(box, flags); > > let availWidth = box.x2 - box.x1; > let availHeight = box.y2 - box.y1; > > let [minRealNameWidth, minRealNameHeight, > natRealNameWidth, natRealNameHeight] = this._realNameLabel.get_preferred_size(); > > let [minUserNameWidth, minUserNameHeight, > natUserNameWidth, natUserNameHeight] = this._userNameLabel.get_preferred_size(); > > if (natRealNameWidth <= availWidth) > this._currentLabel = this._realNameLabel; > else > this._currentLabel = this._userNameLabel; > > let childBox = new Clutter.ActorBox(); > childBox.x1 = 0; > childBox.y1 = 0; > childBox.x2 = availWidth; > childBox.y2 = availHeight; > > this._currentLabel.allocate(childBox, flags); > }, > > vfunc_paint: function() { > this._currentLabel.paint(); > }, > > _updateUser: function() { > if (this._user.is_loaded) { > this._realNameLabel.text = this._user.get_real_name(); > this._userNameLabel.text = this._user.get_user_name(); > } else { > this._realNameLabel.text = ''; > this._userNameLabel.text = ''; > } > }, >}); > >const UserWidget = new Lang.Class({ > Name: 'UserWidget', > > _init: function(user) { > this._user = user; > > this.actor = new St.BoxLayout({ style_class: 'user-widget', > vertical: false }); > this.actor.connect('destroy', Lang.bind(this, this._onDestroy)); > > this._avatar = new Avatar(user); > this.actor.add_child(this._avatar.actor); > > this._label = new UserWidgetLabel(user); > this.actor.add_child(this._label); > > this._userLoadedId = this._user.connect('notify::is-loaded', Lang.bind(this, this._updateUser)); > this._userChangedId = this._user.connect('changed', Lang.bind(this, this._updateUser)); > this._updateUser(); > }, > > _onDestroy: function() { > if (this._userLoadedId != 0) { > this._user.disconnect(this._userLoadedId); > this._userLoadedId = 0; > } > > if (this._userChangedId != 0) { > this._user.disconnect(this._userChangedId); > this._userChangedId = 0; > } > }, > > _updateUser: function() { > this._avatar.update(); > } >});
Comment on attachment 287788 [details] [review] Included scale_factor in avatar size, consistent with previous usage This is not a patch, that's a file. Can you create a proper patch (See https://wiki.gnome.org/GnomeLove/SubmittingPatches for instructions).
Created attachment 287888 [details] [review] Patch
Review of attachment 287888 [details] [review]: ::: js/ui/userWidget.js @@ +13,3 @@ +let scaleFactor = St.ThemeContext.get_for_stage(global.stage).scale_factor; +const AVATAR_ICON_SIZE = 64*scaleFactor; We can't do this here, as the scale factor might change at runtime. Additionally, this is wrong for the St.Icon usage below. Just do the multiplication for the St.Bin only when UserWidget is constructed.
Created attachment 287891 [details] [review] Attempt 2
If you haven't guessed by now, I'm not a programmer. So if that isn't correct maybe someone else should stab at it?
Wow, really? Could have fooled me! This looks right. I cleaned it up and pushed it: https://git.gnome.org/browse/gnome-shell/commit/?id=18f569280ce79cc9836e85b0a2919c4fa5613d2d Thanks so much!
Great, thanks for the help. Cheers.