Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

FlatButton Pulse #339

Closed
MarcoCarnevali opened this issue Apr 25, 2016 · 47 comments
Closed

FlatButton Pulse #339

MarcoCarnevali opened this issue Apr 25, 2016 · 47 comments
Assignees

Comments

@MarcoCarnevali
Copy link

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
Copy link
Member

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
Copy link
Author

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
Copy link
Member

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

@MarcoCarnevali
Copy link
Author

Thank you very much @DanielDahan :)

@MarcoCarnevali
Copy link
Author

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
Copy link
Member

daniel-jonathan commented Apr 27, 2016

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
Copy link
Author

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

@MarcoCarnevali
Copy link
Author

@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
Copy link
Member

@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
Copy link
Author

@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
Copy link
Member

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

@MarcoCarnevali
Copy link
Author

MarcoCarnevali commented Apr 29, 2016

@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
Copy link
Member

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
Copy link
Author

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

@edding
Copy link

edding commented Apr 29, 2016

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

@MarcoCarnevali
Copy link
Author

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

@edding
Copy link

edding commented Apr 29, 2016

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

@MarcoCarnevali
Copy link
Author

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

@daniel-jonathan
Copy link
Member

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
Copy link

edding commented Apr 29, 2016

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
Copy link
Member

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

@MarcoCarnevali
Copy link
Author

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

@daniel-jonathan
Copy link
Member

daniel-jonathan commented Apr 29, 2016

@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
Copy link
Author

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

@daniel-jonathan
Copy link
Member

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
Copy link
Author

@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
Copy link
Member

daniel-jonathan commented Apr 29, 2016

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

@MarcoCarnevali
Copy link
Author

@DanielDahan
simulator screen shot 29 apr 2016 8 43 50 pm

@edding
Copy link

edding commented Apr 29, 2016

@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
Copy link
Author

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

@daniel-jonathan
Copy link
Member

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

@MarcoCarnevali
Copy link
Author

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

@edding
Copy link

edding commented Apr 29, 2016

@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
Copy link
Author

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

@edding
Copy link

edding commented Apr 29, 2016

@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
Copy link
Author

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

@daniel-jonathan
Copy link
Member

@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
Copy link
Author

@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
Copy link
Author

@DanielDahan with a FabButton or a flatButton?

@MarcoCarnevali
Copy link
Author

@DanielDahan Still didn't fix this :\

@daniel-jonathan
Copy link
Member

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

@MarcoCarnevali
Copy link
Author

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

@daniel-jonathan
Copy link
Member

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

@MarcoCarnevali
Copy link
Author

@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
Copy link
Member

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

@daniel-jonathan
Copy link
Member

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

@daniel-jonathan
Copy link
Member

@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!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

No branches or pull requests

3 participants