ubuntu-phone team mailing list archive

[Zsombor Egri <zsombor.egri@xxxxxxxxxxxxx>]

Ahh, sorry, the previous mail went out accidentally uncompleted. So,
continuing:

CustomStyle.qml in Ubuntu.Components.Themes.Ambiance

Item {
    property string firstLabelFamily: "Ubuntu"
    property string secondLabelFamily: "Courrier New"
}

CustomComponent.qml

StyledItem {
    id: custom
    Label {
        font.family: __styleInstance.firstLabelFamily
        text: "First line"
    }
    Label {
        font.family: __styleInstance.secondLabelFamily
        text: "Second line"
    }
    style: Theme.createStyleComponent("CustomStyle.qml", custom)
}

In this way the CustomStyle doesn't do anything else but styles the two
labels inside the CustomComponent. Same thing is needed in
OptionSelectorDelegate.

Hope this helps.

Cheers,
Zsombor


On Mon, Sep 9, 2013 at 2:41 PM, Zsombor Egri <zsombor.egri@xxxxxxxxxxxxx>wrote:

> Hi Robert,
>
> With the previous theme engine it would have been possible to do such a
>
>
> On Sun, Sep 8, 2013 at 7:39 PM, Robert Schroll <rschroll@xxxxxxxxx> wrote:
>
>> Hi all,
>>
>> This email is going to run on a bit, so let me put my questions here at
>> the top and motivate them afterwards:
>>
>> 1) Is it possible to adjust the style of a single compound widget?  (That
>> is, a QML element with several sub-elements.  I don't know the terminology
>> here.)
>>
>
> With the previous theme engine it would have been possible do alter
> sub-widgets styles, i.e. alter the label's font family or other font
> settings. The theming was context sensitive, so you were able to declare
> different styles of a widget depending on who was its parent. We dropped
> that engine due to performance and stability issues, and so far we haven't
> planned to introduce such a feature in the current theming. However that
> does not mean that we will never do so.
>
>
>> 2) If not (and I haven't found one), should there be?
>>
>
> Perhaps. It all depends on the use cases and UX. But for sure there would
> be use cases where having such a feature in theme engine would be
> beneficial. Even now it is possible to select the style of a widget
> depending on who is its parent. It is just the widgets must be made so to
> be parent sensitive.
>
>
>>
>> I'm working on an epub reader for the app showdown [1].  One of the
>> options I provide is the font in which the epub will be displayed.  I want
>> to do this with an OptionSelector, and I'd like to display the name of each
>> font in that font.  It looks like this is impossible with the SDK as it
>> currently stands.  (Please correct me if I'm wrong.)
>>
>> With simple QML widgets, like a Rectangle, you can adjust the properties
>> of the widget to change its styling.  But the widget I need to adjust, an
>> OptionSelectorDelegate, is a compound widget -- the text is in a Label
>> inside of the OptionSelectorDelegate, and there's no way for me to access
>> this.  These Labels don't have ids, and even if they did those ids wouldn't
>> be accessible outside of that .qml file, for some reason.
>>
>> I came up with a simple fix to this: Give the Labels ids, and then give
>> the OptionSelectorDelegate properties referencing the label.  Then when I
>> make an OptionSelectorDelegate, I can adjust the font of the label through
>> the textLabel.fontFamily property.  I've written up a patch and submitted
>> it to Launchpad [2].
>>
>> I asked about this on IRC, and mzanetti opined that this was not the
>> right approach.  Internals shouldn't be exposed like this.  And while I
>> disagree, this is not an unreasonable position.  Instead, mzanetti
>> suggested that the OptionSelectorDelegate should become themable, and then
>> I could provide my own theme to do the styling.
>>
>
> I must agree with Michael, that is not the way things should be done.
> Instead OptionSelectorDelegate should be themed (which is indeed not the
> case yet). If it would be themable, the component style would be able to
> set different settings for the labels inside the component. So I would
> approach the problem from this side, creating a style element for the
> OptionSelectorDelegate, instead of publishing the label IDs.
>
>
>>
>> It may be that it should be themable, but this wouldn't solve my problem.
>>  I don't want to redo the theming of the widget; I just want to tweak the
>> font.  I could do this, theoretically, by creating a new widget based on
>> the OptionSelectorDelegateStyle widget and tweaking the font there.  But
>> this runs into three problems:
>>
>> 1) Not all the *Style widgets are exposed in the Theme directories.  (I
>> recently ran into this problem when trying to theme a Slider; see [3].)
>>
>
> Yes, and that can be misleading. The components should all be exported, so
> feel free to remove the internal keyword from the component you need.
>
>
>> 2) I would have to inherit from a specific theme.  If that changes in the
>> future, due to system changes or user choice, my styling would be
>> completely wrong.
>>
>
> Themes provided by the SDK will always be in sync with the components. So
> if you need to override some properties from the style, you will be most
> likely on the safe side. But only after we declare the style API stable. So
> far that hasn't been done yet, as our design changes pretty frequently.
> Another approach would be to provide hinting possibilities for our
> components. So in that case you could simply hint which style property you
> want to change, give the desired value, and that's it. The hint will be
> applied only if the property exist in the style, you won't see warnings but
> you won't either know why the hint hasn't been applied.
>
>
>>
>> 3) I would still need access to the internal Label of the style widget,
>> which is the very thing that got us going down this path!
>>
>
> As said, if the component is made to be styled (which is unfortunately not
> the case for the OptionSelectorDelegate), then you would be able to
> customize the labels through the style.
>
>
>> Hence my questions: Is there a way to set the font in an
>> OptionSelectorDelegate?  There doesn't seem to be.  Should there be?  I
>> think so.  How should this work?  This I don't know enough about to comment.
>>
>
> A styled item (component derived from StyledItem) can access the style
> instance properties through the __styleInstance private property. In this
> way you can style internal elements of a component through style
> properties. Example:
>
> CustomStyle.qml
>
> Item {
>     property string firstLlabelFamily: "Ubuntu"
>
> }
>
>
>>
>> Thanks,
>> Robert
>>
>> [1] https://github.com/rschroll/**beru <https://github.com/rschroll/beru>
>> [2] https://bugs.launchpad.net/**ubuntu-ui-toolkit/+bug/1220533<https://bugs.launchpad.net/ubuntu-ui-toolkit/+bug/1220533>
>> [3] https://github.com/rschroll/**beru/commit/**
>> 927b2fd377d7cc86b0633a2707b03c**3a79a330db<https://github.com/rschroll/beru/commit/927b2fd377d7cc86b0633a2707b03c3a79a330db>
>>
>>
>> --
>> Mailing list: https://launchpad.net/~ubuntu-**phone<https://launchpad.net/~ubuntu-phone>
>> Post to     : ubuntu-phone@lists.launchpad.**net<ubuntu-phone@xxxxxxxxxxxxxxxxxxx>
>> Unsubscribe : https://launchpad.net/~ubuntu-**phone<https://launchpad.net/~ubuntu-phone>
>> More help   : https://help.launchpad.net/**ListHelp<https://help.launchpad.net/ListHelp>
>>
>
>