I have updated another post , i posted a wrong file. For the test , yes i overridden on purpose to override all listitems to make sure.
I have attached full test tar.gz
On Tue, Aug 18, 2015 at 7:50 PM, John Spackman <john-li...@zenesis.com>
wrote:
> I don’t see where you’re setting the appearance; what happens if you
> modify vlistest.listItem’s properties to:
>
> properties: { content: { apply: "_applyPost", nullable: true },
> appearance: {
> init: "listitem",
> refine: true
> } },
>
> Or alternatively, what happens if you add this to your Appearance.js:
>
> "control" : { alias : "atom", style : function(states) {
> return { padding: [20,10] };
> }
> }
>
> As an aside, “listitem" is also the name of a standard appearance and you
> might want to choose a different name unless you want all listitems to have
> your new style
>
> John
>
> From: Phyo Arkar <phyo.arkarl...@gmail.com>
> Reply-To: qooxdoo Development <qooxdoo-devel@lists.sourceforge.net>
> Date: Tuesday, 18 August 2015 14:11
>
> To: qooxdoo Development <qooxdoo-devel@lists.sourceforge.net>
> Subject: Re: [qooxdoo-devel] Set margin between listitems
>
> I’ve tested to make sure if my code is the problem , unfortunately it
> isn’t. Setting Margin of ListItem Dosen’t work in default virtual-list with
> default listItem either.
>
> here is the code:
>
>
> qx.Class.define("vlistest.listItem", {
> extend: qx.ui.core.Widget,
> include: [qx.ui.form.MModelProperty],
> construct: function() {
> this.base(arguments);
> var chat_grid = new qx.ui.layout.Grid();
> chat_grid.setColumnFlex(1, 1);
> this._createChildControl("content");
>
> },
>
> properties: {
> content: {
> apply: "_applyPost",
> nullable: true
> }
>
> },
>
> members: {
> _createChildControlImpl: function(id) {
> var that = this;
> var control;
>
> switch (id) {
> case "content":
> control = new qx.ui.basic.Label();
> control.addListener("mouseover", function() {
> control.setSelectable(this.hasState("selected"))
> control.setNativeContextMenu(this.hasState("selected"))
> }, this)
> control.addListener("mouseout", function() {
> control.setSelectable(false)
> control.setNativeContextMenu(false)
> }, this)
> control.setWrap(true)
> control.setAllowGrowX(true);
> control.setRich(true);
> control.set({
> appearance: "content"
> });
> this.add(control, {
> row: 0,
> column: 0,
> colSpan: 4
> });
> break;
> return control || this.base(arguments, id);
> },
>
> _applyPost: function(value, old) {
> var content = this.getChildControl("content");
> content.setValue(value);
> // console.log(value)
> }
> }
> }
> });
>
> here is the appearance , i over written listitem and margin of 100:
>
>
> qx.Theme.define("vlistest.theme.Appearance",
> {
> extend : qx.theme.indigo.Appearance,
>
> appearances :
> {
> "list" :
> {
> alias : "scrollarea",
> include : "textfield"
> },
>
> "listitem" :
> {
> alias : "atom",
>
> style : function(states)
> {
> var padding = [3, 5, 3, 5];
> if (states.lead) {
> padding = [ 2, 4 , 2, 4];
> }
> if (states.dragover) {
> padding[2] -= 2;
> }
>
> var backgroundColor;
> if (states.selected) {
> backgroundColor = "background-selected"
> if (states.disabled) {
> backgroundColor += "-disabled";
> }
> }
> return {
> gap : 4,
> marginBottom : 100,
> padding : padding,
> backgroundColor : backgroundColor,
> textColor : states.selected ? "text-selected" : undefined,
> decorator : states.lead ? "lead-item" : states.dragover ?
> "dragover" : "chatitem",
> opacity : states.drag ? 0.5 : undefined
> };
> }
> }
> }
> });
>
> Here is the decoration, i added a shadow border
>
>
> qx.Theme.define("vlistest.theme.Decoration",
> {
> extend : qx.theme.indigo.Decoration,
>
> decorations :
> {
> "chatitem": {
> style: {
> width: 0,
> shadowColor: "shadow",
> shadowBlurRadius: 1,
> widthBottom: 2,
> color: "rgb(217, 217, 217)",
> backgroundColor: "transparent"
> }
> }
> }
> });
>
> On Tue, Aug 18, 2015 at 6:18 PM, Phyo Arkar <phyo.arkarl...@gmail.com>
> wrote:
>
> Thanks John , i am creating a new qooxdoo app to test it out.
>>
>> On Tue, Aug 18, 2015 at 5:51 PM, John Spackman <john-li...@zenesis.com>
>> wrote:
>>
>>> Not having used virtual before I’m shooting in the dark a bit here, but
>>> I can see from the demo browser (at
>>> http://demo.qooxdoo.org/devel/demobrowser/#virtual~List.html) that a
>>> List contains qx.ui.virtual.layer.WidgetCell and inside it is a
>>> qx.ui.form.ListItem.
>>>
>>> That means that you can change the gap layout using an appearance, in
>>> exactly the way as we both did earlier. The error you had before looks
>>> like whatever you were setting the appearance property of, it wasn’t a
>>> ListItem (were you setting WidgetCell.appearance instead?)
>>>
>>> John
>>>
>>> From: Phyo Arkar <phyo.arkarl...@gmail.com>
>>> Reply-To: qooxdoo Development <qooxdoo-devel@lists.sourceforge.net>
>>> Date: Tuesday, 18 August 2015 12:08
>>>
>>> To: qooxdoo Development <qooxdoo-devel@lists.sourceforge.net>
>>> Subject: Re: [qooxdoo-devel] Set margin between listitems
>>>
>>> So what i just need now : Able to set margin for listItems to increase
>>> Independant Gap between List Items, so that we can set on
>>> Decorators/Boxshadows on listitems without overlapping each other.
>>>
>>> That would be quite easy if a QOoxdoo Core Dev can Enlighten us.
>>>
>>> On Tue, Aug 18, 2015 at 2:37 PM, Phyo Arkar <phyo.arkarl...@gmail.com>
>>> wrote:
>>>
>>>> Thanks , the paddings works , but the margin dosen't
>>>>
>>>> on http://phwa.be , we hacked it by adding a component around the list
>>>> item , but that implemention is slow and when virtual listitems resizes
>>>> (images , video , etc) it dosen't resize sometimes.
>>>>
>>>> Thats why i am trying to see if Margin can be set between list items
>>>> (You can set Margin , but It never got effected , when look into inspector
>>>> , there is NO margin property set for list items , but any other widget is
>>>> fine , which is very weird).
>>>>
>>>> Paddings will just make list items wider , not like margin.
>>>>
>>>> On Tue, Aug 18, 2015 at 2:19 PM, John Spackman <john-li...@zenesis.com>
>>>> wrote:
>>>>
>>>>> Ah, I missed the bit about virtual lists, sorry.
>>>>>
>>>>> Yes, in Atom its the gap between the icon and the label; if you’re
>>>>> using a completely custom widget then the layouting inside the object is
>>>>> up
>>>>> to the widget, so you would have to tell that layout to move the text
>>>>> over. The margins and paddings on the widget would still work though
>>>>> (although I’ve not used the virtual widget I imagine that’s the case)
>>>>>
>>>>> John
>>>>>
>>>>> From: Phyo Arkar <phyo.arkarl...@gmail.com>
>>>>> Reply-To: qooxdoo Development <qooxdoo-devel@lists.sourceforge.net>
>>>>> Date: Tuesday, 18 August 2015 08:43
>>>>> To: qooxdoo Development <qooxdoo-devel@lists.sourceforge.net>
>>>>> Subject: Re: [qooxdoo-devel] Set margin between listitems
>>>>>
>>>>> I think it is due to , not using atom. I am using custom widget. and
>>>>> Gap is only horizontal space between objects right?
>>>>>
>>>>> On Tue, Aug 18, 2015 at 2:12 PM, Phyo Arkar <phyo.arkarl...@gmail.com>
>>>>> wrote:
>>>>>
>>>>>> i am using virtual lis t(list.List) , is it because of that?
>>>>>>
>>>>>> going to test your code , thanks lots!
>>>>>>
>>>>>> On Tue, Aug 18, 2015 at 2:11 PM, Phyo Arkar <phyo.arkarl...@gmail.com
>>>>>> > wrote:
>>>>>>
>>>>>>> this.classname
>>>>>>> "qx.ui.core.queue.Manager"
>>>>>>>
>>>>>>> this.hf is undefined
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>> On Tue, Aug 18, 2015 at 2:02 PM, Phyo Arkar <
>>>>>>> phyo.arkarl...@gmail.com> wrote:
>>>>>>>
>>>>>>>>
>>>>>>>> On Tue, Aug 18, 2015 at 1:57 PM, John Spackman <
>>>>>>>> john-li...@zenesis.com> wrote:
>>>>>>>>
>>>>>>>>> typeof hf
>>>>>>>>>
>>>>>>>>
>>>>>>>> Thanks , i am working on it.
>>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>
>>>>> ------------------------------------------------------------------------------
>>>>> _______________________________________________ qooxdoo-devel mailing list
>>>>> qooxdoo-devel@lists.sourceforge.net
>>>>> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>>>>>
>>>>>
>>>>> ------------------------------------------------------------------------------
>>>>>
>>>>> _______________________________________________
>>>>> qooxdoo-devel mailing list
>>>>> qooxdoo-devel@lists.sourceforge.net
>>>>> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>>>>>
>>>>>
>>>>
>>> ------------------------------------------------------------------------------
>>> _______________________________________________ qooxdoo-devel mailing list
>>> qooxdoo-devel@lists.sourceforge.net
>>> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>>>
>>>
>>> ------------------------------------------------------------------------------
>>>
>>> _______________________________________________
>>> qooxdoo-devel mailing list
>>> qooxdoo-devel@lists.sourceforge.net
>>> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>>>
>>>
>>
> ------------------------------------------------------------------------------
> _______________________________________________ qooxdoo-devel mailing list
> qooxdoo-devel@lists.sourceforge.net
> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>
>
> ------------------------------------------------------------------------------
>
> _______________________________________________
> qooxdoo-devel mailing list
> qooxdoo-devel@lists.sourceforge.net
> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>
>
vlistest.tar.gz
Description: GNU Zip compressed data
------------------------------------------------------------------------------
_______________________________________________ qooxdoo-devel mailing list qooxdoo-devel@lists.sourceforge.net https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
