Recent Widgets


Register for DashboardWidgets

Recent Forums Posts

Partners


iCompositions

MacDesktops.net

RSS Showcase
RSS Comments
RSS Forums

This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies. Posted in: Widget Development

Controls and control regions

Author Message
dtrain



Joined: 06 May 2005
Posts: 4

Posted: Fri May 06, 2005 - 12:37 am    Post subject: Controls and control regions Reply with quote

Hello all:

I have a few control region issues that I need help with, but first I'd like to say that I think it's weird that we are using CSS to delineate the control region and not the drag region. ??? I think it should be the opposite, like most other platforms. That said...

I know that Apple wants everyone to use custom graphic controls instead of Aqua controls. But my widget really only needs the simple aqua scrollbar that Safari generates when the content is longer than the container. How do I designate the control region for the common web scrollbar? As is, only the scrollbar buttons work properly (but I think that's because the click is bleeding through to the control), but the scrollbar slider and track just drag the widget. The CSS is meant to be applied to an image, and does not work if I try to apply it to the object (i.e. div, iframe, etc.).

Anyone have any ideas in this department?

If this is impossible... does anyone have a nice "fully functional" javascript scrollbar that is easy to implement? I've tried ripping the one that is in the Yellow Pages widget... but have had no luck. The ones I've found online are weak and don't have track control...but at this point I'd just take a good slider...

Any help would be much appreciated.

-d
View user's profile Send private message Send e-mail Widgets
Chris



Joined: 27 Jan 2005
Posts: 344
Location: Durham, UK

Posted: Fri May 06, 2005 - 7:02 am    Post subject: Reply with quote

Why don't you like doing it in CSS? I'd say it's part of the presentation layer and so belongs there. You should've tried to juggle the first method where it was all handled in JavaScript - it got exponentially more annoying Razz

Anyhoo. Just make the element that you've set to overflow: auto for the scrollbars to appear be a dashboard-region. You can offset the regions boundaries, so if the element is 100px wide, and the scrollbar is roughly 16px (I think), then just do:

-apple-dashboard-region: dashboard-region(control rectangle 0 0 0 84px);

However, don't scrollbars automatically have a control region attached to them like normal controls? I haven't checked, but assumed they did...
View user's profile Send private message Send e-mail Visit poster's website AIM Address Widgets
dtrain



Joined: 06 May 2005
Posts: 4

Posted: Fri May 06, 2005 - 2:36 pm    Post subject: Reply with quote

It's not that I mind creating the regions in CSS... it that I think the CSS should delineate the drag area and not the control area... that way, any control you add to you project would automatically work and all you would have to do is define the drag region.

Anyway, I've tried the methods you point out... but haven't had any luck yet... an no they don't automatically have control regions. The buttons react to clicks, but it's more like the click is "bleeding" through the drag layer... because the button reaction is abnormal.

I'll keep plugin away... any other ideas?

-d
View user's profile Send private message Send e-mail Widgets
Chris



Joined: 27 Jan 2005
Posts: 344
Location: Durham, UK

Posted: Fri May 06, 2005 - 6:36 pm    Post subject: Reply with quote

OK. I'm thoroughly confused. I just had a widget (shows a list of people available on iChat) that was draggable everywhere - no control regions anywhere. I then changed the main bit to be a certain height and width and set the overflow to auto. The scrollbar works fine... I didn't need to set any control regions.

And what do you mean by draggable regions? Places that accept items dragged onto them? Although, I'm beginning to suspect you mean the scroll thumb on the scroll bar that you drag...

You seem to be describing how it was in pre-release builds of Tiger. You're using the GM, yeah?
View user's profile Send private message Send e-mail Visit poster's website AIM Address Widgets
dtrain



Joined: 06 May 2005
Posts: 4

Posted: Fri May 06, 2005 - 7:45 pm    Post subject: Reply with quote

I'm just as confused... I'm working on my widget right now... I have a div tag with overflow set to auto... when I view the widget in safari it works like it's suppose to... when I bring it into dashboard the scrollbar does not slide, it drags the widget. ???? what am I doing wrong?

As far as the CSS goes, I was just saying that it would be better if we designated the area that people can click to drag the widget around dashboard instead of designating the control regions... so basically opposite of what we have to do now... this is nothing but a pipe dream since that's not the way these widgets work... I just think it's a little counter-intuitive. So scratch my opinion... why doesn't mine work like yours?

I'm running a retail copy of Tiger (got mine at the Newport Beach location...first person to purchase at that location... jeez I'm a dork!).

Anyway, I'm wondering if page encoding has something to do with it... if you could post a simple widget with the div scroll working correctly for you... i could try it on my system... that way I could tell it it's something I'm doing wrong in the widget versus something wrong with my dashboard.

just a thought.

-d
View user's profile Send private message Send e-mail Widgets
Chris



Joined: 27 Jan 2005
Posts: 344
Location: Durham, UK

Posted: Sat May 07, 2005 - 2:40 am    Post subject: Reply with quote

dtrain wrote:
I'm just as confused... I'm working on my widget right now... I have a div tag with overflow set to auto... when I view the widget in safari it works like it's suppose to... when I bring it into dashboard the scrollbar does not slide, it drags the widget. ???? what am I doing wrong?


Nothing. It was me being a numpty. Well, observing a dashboard bug, it seems. The first thing I did was to set the dashboard region, but then I commented it out and it still worked after a refresh. Which led me to believe you didn't need it - which appears to be false, as leaving it out and restarting the widget completely (closing then re-opening) exhibits the behaviour you describe.

dtrain wrote:

As far as the CSS goes, I was just saying that it would be better if we designated the area that people can click to drag the widget around dashboard instead of designating the control regions... so basically opposite of what we have to do now... this is nothing but a pipe dream since that's not the way these widgets work... I just think it's a little counter-intuitive.


Ohhhhhh. I get you now. Right, yeah, I see where you're coming from yeah.


dtrain wrote:

why doesn't mine work like yours?


It does, I was just being an eejit Smile

dtrain wrote:

If you could post a simple widget with the div scroll working correctly for you... i could try it on my system... that way I could tell it it's something I'm doing wrong in the widget versus something wrong with my dashboard.


http://www.vanillasoap.com/widgets/Scrollbars.wdgt.zip
View user's profile Send private message Send e-mail Visit poster's website AIM Address Widgets
dtrain



Joined: 06 May 2005
Posts: 4

Posted: Sat May 07, 2005 - 7:21 pm    Post subject: Reply with quote

Success!!!!

my problem was with the CSS... I took Apple's example literally:

Quote:
.control-circle-example {
...
-apple-dashboard-region: dashboard-region(control circle 5px 5px 5px 5px);
...
}


I've been working with CSS for years and years and have never seen the ellipses used before... so that should have been my first hint... But I figured they show it in the example for a reason... Anyway all I had to do was take them out and it works like a charm... I went looking for documentation on the "..." but couldn't find any... does anyone know what this is? I do know that any style definition that comes after it does not display.

Anyway thanks for all the help!

-d
View user's profile Send private message Send e-mail Widgets
Chris



Joined: 27 Jan 2005
Posts: 344
Location: Durham, UK

Posted: Sun May 08, 2005 - 5:27 am    Post subject: Reply with quote

They're just using ellipses to show that there's extra code and stuff there. As in

Code:

.control-circle-example {
//your stuff here
-apple-dashboard-region: dashboard-region(control circle 5px 5px 5px 5px);
//some more of your stuff here
}


They're nothing to do with CSS Smile
View user's profile Send private message Send e-mail Visit poster's website AIM Address Widgets
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.

 
Powered by phpBB © 2001, 2002 phpBB Group