FlatButton Pulse

[MarcoCarnevali]

Hello all, it is possible to change the Pulse of the FlatButton from rectangular to circle? Like it is on Android.

If not, it is possible to reduce the size of the pulse?

Thank you very much in advance

Marco.

[daniel-jonathan]

Hello,

Try setting the pulseFocus property to true, otherwise, later today I will be working on the pulse animations in general to make them more like Google's.

[MarcoCarnevali]

Already tried with that but, it's not what I'm looking. The problem is that now the pulse takes too much spaces in width. Thank you very very much

[daniel-jonathan]

Okay. I will leave this issue up as I work on the new pulse animations :)

[MarcoCarnevali]

Thank you very much @danieldahan :)

[MarcoCarnevali]

Hello @danieldahan, thank you in advance for the support. I tried changing the layer ecc.. but I couldn't create a round pulse or a pulse with less width... Did you find out something?

Thank you, Marco.

[daniel-jonathan]

Yes, I am working on a few things to be released today. My main goal today is to add the documentation for it. Basically, as I improve everything, I will be adding documentation to help in support.

Sorry, for any hold up, but I think you will like what is coming :)

[MarcoCarnevali]

@danieldahan Oh cool! thank you !!! :)

[MarcoCarnevali]

@danieldahan if you can.... Can you reply here when you update all so I receive the notification ? Thanks you are wonderful man ... If you need help tell me :)

[daniel-jonathan]

@MarkOnly Thank you :) I have pushed some code up today for TextField, for some people to test while I finish up the remaining work. Once that is done, I will be pushing the pulse animation updates. The last few days have been really busy, for the work here, and the work I do elsewhere. So today should be a good day of releases. I will keep you posted.

[MarcoCarnevali]

@danieldahan did you pushed the textfields corrections? Because I can't see them... anyway.. I see that you have a lot of work to do... if you need some help we can do something together so I can help you ;)

[daniel-jonathan]

@MarkOnly I am going to be pushing it in about an hour, would you be free to test? 342

[MarcoCarnevali]

@danieldahan I will try... I think I can test it in about 4 hour from now :) then if you need help for the pulse thing tell me.

[daniel-jonathan]

No worries, when you get a chance if you do :) After that push, I will be working on pulse, then sidenav. So maybe you will be able to test the pulse.

[MarcoCarnevali]

@danieldahan Cool, thank you very much! :')

[edding]

@MarkOnly Try to set the shape of button to .Circle

[MarcoCarnevali]

@EdwardDing Thank you for your reply, but it doesn't work :\

[edding]

@MarkOnly You need to set the frame of the button to a square first.

[MarcoCarnevali]

@EdwardDing With this doesn't work. searchButton.frame = CGRect(x: 0, y: 0, width: 65, height: 65) searchButton.shape = .Circle

[daniel-jonathan]

It will 100% not work, as the circle takes control of the width and height properties of the frame. I am almost done the TExtField, confirming a last animation.

[edding]

Hmm that's weird... I've been using this method through out my App. I just dragged a UIView into current view and set the class of it as FlatButton then I set the constraint of it to make it a square and it works perfectly.... May it is because of the constraint I set?

[daniel-jonathan]

@EdwardDing Yes that could be it :) The pulse animations need to be updated in general.

[MarcoCarnevali]

@EdwardDing yeah probably the constraints, I'm using flat buttons in the navigation bar so I don't use constraints.

[daniel-jonathan]

@MarkOnly Okay, now I see what you are looking to do, like Inbox. Okay I will make that one of my test cases, but in general, if you did make it a circle with pulseCenter = true, it may work. There may be a conflict with the sizing since part of the sizing is dependant on Apple in the NavBar. You could place with the spacing property as well to adjust the sizing, and the contentInset sizing.

As a workaround until I update the animations.

[MarcoCarnevali]

@danieldahan thanks...do you want work it together now?

[daniel-jonathan]

Shortly, I have a release to do with some other work I am part of, and they are in crunch mode, and that is why I have been slow on the issues coming in.

[MarcoCarnevali]

@danieldahan ok no problem 👍, fast question: how could i make it circle as you suggest? as changing the shape doesn't work, changing the frame neither... I tried also the pulselayer...

[daniel-jonathan]

Try using a FabButton with pulseCenter = true and set the depth = .None

[MarcoCarnevali]

@danieldahan

[edding]

@MarkOnly Actually I was copying the UI of Inbox as well... My solution is to add a BarButtonItem to the nav bar and then I created a MaterialButton and set it as the customView of the barButtonItem... Here is what it looks like when you click the button: screenshot Is it what you are trying to implement?

[MarcoCarnevali]

@EdwardDing Yeah exactly that... but I'm using a material toolbar

[daniel-jonathan]

@EdwardDing thank you, @MarkOnly I will be available shortly, @EdwardDing looks like he knows how to handle this to fast track your solution.

[MarcoCarnevali]

@EdwardDing thank you, so you use the app navigation controller right?

[edding]

@MarkOnly Yes... The reason I chose the original navigation bar is because that when we try to set toolbar.rightControls of a tool bar it will automatically calculate the size of each controls thus we have no control to the frame of the button.

[MarcoCarnevali]

@EdwardDing yeah I notice that but I would like to keep the toolbar

[edding]

@MarkOnly Well if you insist on using toolbar... A unusually quick fix is to add the button as a subview to the toolbar instead of push it into the right controls vector

[MarcoCarnevali]

@EdwardDing this could be an interest Idea, let me see what can I do. Thank you

[daniel-jonathan]

@EdwardDing Sounds like an interesting idea actually in this case. Mind, you, I found if you size the buttons with the edgeInsets greater than 0, it will give some really weird stutter effect. So when you size the button, set those to UIEdgeInsetZero.

[MarcoCarnevali]

@EdwardDing Yes like this works, but it's all messed up of Course. I'm trying to change some code that resize the frame of button when you put the button on the right controls

[MarcoCarnevali]

@danieldahan with a FabButton or a flatButton?

[MarcoCarnevali]

@danieldahan Still didn't fix this :\

[daniel-jonathan]

Today, sorry. Technically it is not broken, it is a rework in design. Like the TextField, it takes time.

[MarcoCarnevali]

@danieldahan Oh okay no problem ;) as I told you I could help you.

[daniel-jonathan]

Okay, can you write a list of all the pulse states we would need to handle?

[MarcoCarnevali]

@danieldahan the functions? from what I saw we need to handle the grid that gives the width and the height of the right and left Controls of toolbar

[daniel-jonathan]

I'll be working on this, feel free to join the conversation here: https://gitter.im/CosmicMind/Material

[daniel-jonathan]

@MarkOnly So I got this working :) a whole new pulse. I am going to apply it everywhere and post it.

[daniel-jonathan]

@MarkOnly I fixed this :) Thank you for bringing it to our attention. I will be adding an enum helper to make this a choice for animation. It is currently in development and will be released later tonight. I am closing this for clean up purposes, thank you!