Bouton iPhone avec une forme non rectangle?

Question

Comment puis-je obtenir un bouton de forme non rectangulaire?

Par exemple, j'ai une image PNG avec transparence alpha. Comment puis-je définir la forme d'un bouton à cette image sans la couleur transparente.

Answer 1

Comme les autres disent que vous devriez avoir une surface raisonnable pour l'enregistrement des événements tactiles, mais je suis sûr que vous savez que vos raisons et ont donc je vais vous dire comment je l'ai fait:

je devais faites ceci il n'y a pas si longtemps et ce que j'ai fait est ce que Sixten Otto vient de suggérer. Il y a quelques conseils à ma question initiale (section « UPDATE ») pour obtenir la valeur alpha pour votre image à un certain point:

How to create a transparent window with non-rectangular buttons?

Edit: Je suggère le sous-classement UIControl dans l'exemple ci-dessous, mais si vous n'avez pas besoin d'un comportement spécial sur votre bouton en dehors de la "non-rectangularité" de celui-ci alors juste le sous-classement d'un UIButton sans bordure mis en place avec votre PNG fera le travail et nécessitera moins de travail. Vous avez plus de contrôle sur le comportement du contrôle en sous-classant UIControl et en le faisant "à la dure".

Je suggère que vous sous-classe UIControl et remplacer les méthodes d'événement tactile, puis vérifiez pour alpha sous le point de prise et ne pas gérer l'événement si alpha == 0.Pour dessiner, remplacez drawRect: et utilisez la méthode NSImage pour dessiner votre image dans le cadre du contrôle.

Vous devez d'abord charger l'image et obtenir une représentation bitmap de celui-ci:

buttonImage = [NSImage imageNamed:@"myButtonImage"]; 
buttonImageRep = [[buttonImage representations] objectAtIndex:0]; 

Ensuite, vous pouvez dessiner à la vue du contrôle: (où stateImage est un pointeur sur l'image qui doit être faite selon si le bouton est pressé ou non)

- (void)drawRect:(NSRect)aRect { 
[stateImage drawInRect:[self bounds] fromRect:NSMakeRect(0.0,0.0,[buttonImage size].width,[buttonImage size].height) 
     operation:NSCompositeSourceOver fraction:1.0]; 
} 

A ce stade, vous avez dessiné votre bouton avec votre image png. Vous pouvez remplacer les méthodes d'événement tactile et gérer l'événement si l'alpha est pas 0:

NSColor *colorUnderMouse = [buttonImageRep colorAtX:mouse.x y:mouse.y]; 
float alpha = [colorUnderMouse alphaComponent]; 

C'est ce que je l'ai fait et ça fonctionne à merveille. J'espère que cela t'aides! N.B: Mon exemple est pour le Mac mais il devrait aussi fonctionner sur l'iPhone, peut-être avec de légères modifications.

Answer 2

boutons rectangulaires sont un type de bouton, vous pouvez utiliser le type de bouton personnalisé et d'assigner une image pour se débarrasser des bords rectangulaires du bouton ... Heres une référence à des types de boutons http://developer.apple.com/iphone/library/documentation/UIKit/Reference/UIButton_Class/UIButton/UIButton.html#//apple_ref/doc/c_ref/UIButtonType et à UIButton http://developer.apple.com/iphone/library/documentation/UIKit/Reference/UIButton_Class/UIButton/UIButton.html

Answer 3

Il semble que vous souhaitiez que la zone cliquable du bouton corresponde exactement au PNG que vous utilisez.

Si c'est ce que vous cherchez, je dirais d'abord de ne pas le faire. L'iPhone est pressé avec un doigt, ce qui n'a généralement pas la précision nécessaire pour distinguer une si petite région. Cependant, si vous êtes bloqué sur l'idée, la solution consiste à ne pas utiliser de boutons du tout, à la place gérer le clic dans un cadre parent et interpréter manuellement la valeur X/Y du clic pour déterminer s'il est dans certains zone de délimitation (Dans le cas d'un bouton de bord arrondi, consisterait probablement à orner le résultat de la vérification de 4 cercles et 2 rectangles)

Modifier: En réalisant une partie de votre question originale, j'ai remarqué que vous avez mentionné que vous vouliez gérer le Fonction automatiquement basée sur le canal Alpha. Bien que je recommanderais ma méthode de délimitation des régions, vous pourriez en théorie accomplir cela en échantillonnant le PNG pour tester le canal Alpha à une valeur décalée par l'origine du bouton. Potentiellement même en train de le faire dans l'événement click d'un bouton normal.

Answer 4

Comme Guvante says, ce n'est vraiment pas une bonne idée de compter sur des touches de précision. Apple, par exemple, recommande que controls be at least 44px across.

Je vous recommande d'utiliser un UIButton de type UIButtonTypeCustom, de définir l'image du bouton sur votre fichier PNG et de vous enregistrer pour les événements tactiles (see here for more on event handling). Ensuite, dans votre méthode d'action, vous pouvez obtenir les coordonnées du toucher hors de l'événement, et tester ces coordonnées par rapport à l'alpha de votre image pour voir si vous devez le traiter comme une «vraie» touche ou non.

Answer 5

Une autre option pourrait être de diviser votre bouton en plusieurs parties rectangulaires.

Answer 6

@Forme à propos de l'utilisation de 'drawRect' pour implémenter une forme personnalisée pour le bouton.

Mais mieux method à toucher à l'examen à l'intérieur ou non bouton à l'intérieur est à l'aide de

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event; 

Vous pouvez créer votre bouton transparent pour touches dans certaines parties.

Si vous ne pouvez pas utiliser l'image personnalisée pour le bouton (par exemple, si vous dessinez texte sur le bouton), vous pouvez utiliser les nouvelles method pour dessiner la hiérarchie des sous-vues en une image:

- (BOOL)drawViewHierarchyInRect:(CGRect)rect afterScreenUpdates:(BOOL)afterUpdates;