Firefox problem with custom image buttons

[Elias]

Hi,

I create buttons with custom images like this

var myButton = [[CPButton alloc] initWithFrame:CGRectMake(10, 10, 20,
20)];
[myButton setPosition:CGPointMake(10, 10)];
[self addSubview: myButton];

[myButton setImage:[[CPImage alloc] initWithContentsOfFile:[[CPBundle
mainBundle] pathForResource:@"myButton_normal.png"]]];
[self setAlternateImage:[[CPImage alloc] initWithContentsOfFile:
[[CPBundle mainBundle] pathForResource:@"myButton_active.png"]]];
[self setImagePosition:CGPointMake(0, 0)];
[self setBordered:NO];

Now I got the problem that the custom image isn't shown in Firefox
until I click on the button. After that the active image is shown and
when I release the mouse button the normal image is shown also.

This problem only appears in Firefox. No problem in Safari or Chrome.

[Elias]

Am I the only one with this problem?

> This problem only appears inFirefox. No problem in Safari or Chrome.

[Ross Boucher]

The first problem I notice is that there's no method called
setPosition: You should try taking that out.
-Ross

> --
>
> You received this message because you are subscribed to the Google
> Groups "Cappuccino & Objective-J" group.
> To post to this group, send email to objec...@googlegroups.com.
> To unsubscribe from this group, send email to objectivej+...@googlegroups.com
> .
> For more options, visit this group at http://groups.google.com/group/objectivej?hl=en
> .
>
>

[samdev]

In my case (Safari 4.2, jake branch, OS X 10.6.2) image is positioned wrongly unless I click the button. At first, it is 50% shifted down.

[Elias]

@Ross Yeah I forgot that because I made a subclass for the custom
buttons. But I forgot to delete it when I edited this example code. So
in my case, there IS this method ;)

So the code should be like this:

var myButton = [[CPButton alloc] initWithFrame:CGRectMake(10, 10, 20,
20)];

[myButton setImage:[[CPImage alloc] initWithContentsOfFile:[[CPBundle
mainBundle] pathForResource:@"myButton_normal.png"]]];

[myButton setAlternateImage:[[CPImage alloc] initWithContentsOfFile:

[[CPBundle mainBundle] pathForResource:@"myButton_active.png"]]];

[myButton setImagePosition:CGPointMake(0, 0)];
[myButton setBordered:NO];
[contentView addSubview: myButton];

[Elias]

I also made a short video which shows how it looks like.
Keep in mind this is only in Firefox. Safari and Chrome just work
fine.

http://thisagree.com/files/custom_button_fail.mov

Elias

[Elias]

Allright now I made a custom button subclass which now also works in
Firefox seamless.

https://gist.github.com/cbc2179ec48d6c041c42

But I have a question here. The normal button behaviour is that when
you click on it and drag the mouse away from the button not performing
a mouseUp the button should be in an initial state.
At my solution the button is beeing pressed although the mouse is
outside of the button rect.

I took a look into the CPControl.j and there is something I thought it
would help.

[self trackMouse:anEvent];

But that didn't change the problem.

Du you have any idea about it?

[Ross Boucher]

You definitely don't want to create a subclass here. For one, you are redoing work, and some of it potentially slightly broken ways (like the problem you are describing here).

Going back to your original code, here's another problem line:

> [myButton setImagePosition:CGPointMake(0, 0)];

setImagePosition doesn't take a point, it takes a constant. One of the following:

CPNoImage;
CPImageOnly;
CPImageLeft;
CPImageRight;
CPImageBelow;
CPImageAbove;
CPImageOverlaps;

You should try updating your original code and see if that works for you.

-Ross

[Elias]

Thanks for that Ross! I figured out that [myButton
setImagePosition:CPImageOverlaps] sets the correct position of the
image on the button.
But it again fails in Firefox... :( I really don't know what to do
here..

[Joel Norvell]

Elias,

I posted a ticket yesterday (01-02-2010) on the button state problem
you described in this thread.

http://github.com/280north/cappuccino/issues#issue/392

CPButton state toggles when it should not

The test case referenced in my ticket is:

http://dl.dropbox.com/u/2248/ToggleButtonTest.zip

Sincerely,
Joel

[Elias]

@Joel I don't think that it's the same problem here. My problem is
that the CPButton's setImage: method may be partially broken in
Firefox.

[Joel Norvell]

Dear Elias,

> But I have a question here. The normal button behaviour is that
> when you click on it and drag the mouse away from the button
> not performing a mouseUp the button should be in an initial state.
> At my solution the button is beeing pressed although the mouse is
> outside of the button rect.

I thought you were talking about the problem I'd reported, that
CPButton state toggles when it should not.

Sorry if I misinterpreted your comment!

Sincerely,
Joel

[Ross Boucher]

Elias (and anyone else experiencing this problem),

Can you send me your code? I'm not sure I am able to reproduce the problem myself, and I want to make sure we track this down.

-Ross

[Elias]

Sure, here's the test project

http://dl.dropbox.com/u/3167936/etc/Custom%20Button.zip

[Ross Boucher]

This is now fixed in the jake branch.

[Elias]

Cool thanks! Will it be also merged in the next Atlas version?

[Qiushi (Billy) He]

Hi Ross,

If possible please post a patch or describe how the problem was fixed.
I'm working on a project and I can't exactly wait indefinitely for the
next release.

Also, where is the "jake" branch? Do you mind post the URL to that
github project please?

Without Wax
Billy

> >>>>> But it again fails inFirefox... :( I really don't know what to do

> >>>>>>>> Keep in mind this is only inFirefox. Safari and Chrome just work

[Randy Luecke]

A link to the jake branch:
http://github.com/280north/cappuccino/tree/jake