Swift Animations: Facebook Shimmer using Gradient Masks

[@asadjamil7503]

You have any plans to update Instagram Firebase to latest swift 5?

[@LetsBuildThatApp]

Hey Asad, the projects and source code have been updated to Swift 5 for the Instagram Firebase course. Go ahead and download it on the website at www.letsbuildthatapp.com/course/Instagram-Firebase

[@asadjamil7503]

Lets Build That App that’s great!

[@shawnmiller4057]

you plan on adding any additional lessons to instagram firebase?

[@heyrahulrs]

But Swift 5 isn’t released yet🤔🤔

[@asadjamil7503]

Rahul 4.2 is released! Apple will be releasing or not?

[@riklowe]

Hey Brian - you accidentally removed the add subview of the darkTextLabel at the beginning of the video - right at the time you were saying that copy and paste was dangerous !!! Excellent example of why cut and paste is dangerous - lol Thanks for another great video

[@LetsBuildThatApp]

Gotta love the IRONY!

[@seccat]

I like the personal challenge at the end, to apply what you have just demonstrated. I tried to complete the “Kickass Animated Progress Circle”, with multiple views and spinning numbers.... and it was rough. Thx again. Hope to see you apply this to Flutter, some day.

[@gushiciaihaozhe]

Brian everything you explained so clear and simple. Why some original documents make it not easy for human beings to understand?

[@Archetapp]

Nice one Brian! Was looking into this just the other day & this helps clarify things quite a bit for me. 👌

[@krisdundurs6672]

Jared Davidson while Brian is amazing with teaching a bit more advanced stuff, I gotta give you a huge thanks as well, Jared. I literally went from zero to getting my foot in the door just from your Swift 2.0 videos back in the day. Been a professional full-time developer for a year now. 🔥 Love the KZbin iOS community. Thanks, all of you!

[@Archetapp]

Kris Dundurs Thanks Kris! That means a lot. I knew going into this whole KZbin thing that I wasn’t the best programmer by any means, I was there to share what I know and improve as I go along. Glad I could help you get that foot in the door! That’s the hope I have for all of my tutorials, to at least get people interested and started. :]

[@malithmnk93]

Jared Davidson, nice to see you here...❤️

[@mdhasanshaikh6403]

Jared Davidson Thank you so much for helping us. To learn iOS in such simplified way..💛

[@ak9tgaming714]

If someone's wondering why the "darkTextLabel" isn't showing in the shimmer animation , it's because brian forgot to add view.addSubview(darkTextLabel). Awesome tutorial though! Thank You Brian :-)

[@andreiamza184]

Dudeeee you are sooo .... mind blowing... today i had that feeling when i saw the same animation in the youtube app on ios.. how i could i implement that in an IOS app and you did this animation. Great man! Keep up working because you are the best on this platform when it comes about IOS Development.

[@alcprado]

"you can set to whatever color your heart desires" was pretty nice hehee

[@johniiibibal8838]

Holy Sh*t, I've been looking for a guide for this for a long time. I'm glad that I found it on your channel. Love the way you teach. Cheers!

[@meerasayabu3823]

It's really awesome. Thanks Brian.

[@alialnaghmoush]

Brian You are awesome, Thank you for the wonderful lessons I am following your lessons and courses and Your lessons have developed me more Thanks Brian and we look for more lessons and courses

[@Hackmajoris]

Hey Brian. Thank you for your work. You know, I have an idea for a new tutorial. You already did it in the past for this app. It is for the new App Store design. There is some elements like these cards - with a nice animation when you press on them. I did try to implement such animation but without any success.

[@LetsBuildThatApp]

I believe its just a simple frame transform.

[@AlfredoElizondoLife]

You can find that animation on the you tube course on this channel, when he's is making the video player

[@mrvfino]

Hi! I made sample project for that a few weeks ago. :D github.com/markrufino/PopUpCards

[@alcprado]

Man, I wish I had your skills!

[@Vankien96]

Thanks so much. With gradient layer if you want to add .clear color, you should use UIColor(white: 1, alpha: 0). because clearColor has a black color channel with an alpha of 0. so it will show black instead of .clear Color.

[@LetsBuildThatApp]

Not exactly sure about this one. The clearColor seemed pretty clear when I used it. Perhaps the black alpha channel is something I'm not seeing correctly.

[@andreagualandris2462]

beautiful tutorial , thank you

[@sunsunai13]

Nice one Brian

[@tylerrutt17]

Exactly what I've been looking for recently! Thanks!

[@cinquain0]

That video was fire! You need to put up a patreon Brian

[@ssdev1652]

hey man. it's so good that you're back with yt tutorials. Maybe you can make a course (it can be paid for) focused more on 'production' code aspects (protocol-oriented programming, objects with functions, more advanced enums)?

[@swifty7503]

Brian you are my hero! Thank you for this video.

[@tanhuynh432]

Amazing bro!

[@ahmdmhasn]

Thanks Brian.. Perfect as usual!

[@albaqawi]

Awesome so clear and simple

[@edysudarto8825]

Damn!! This is awesome. Thanks a lot, what a great thing to learn, it's amazing!!

[@AgamRandhawa]

just on time Brian.u rock man

[@TheJhuerta88]

You make it look so easy. 👍🏼👍🏼

[@nuno591]

Nice work Brian! For obvious reasons, loading screens are used very commonly while apps are receiving data from the server. How would you do this shimmer if the size of the views were dependent on the data received?

[@nizz4m]

Hope you gonna release the challenge answer. Thank you.

[@sasniyFriz]

This helped me a lot. Thanks, Brian :)

[@SHASHWAT128]

Hey Brian, I tried to repeat the same animation as per your tutorials but I did it as a presented view controller and it didn't work. After struggling for a while I went to your website to download code and same issues happened, then instead of presenting the VC, I pushed it in a navigation controller and magically it started working. Is there any differences in CALayer animations when I present or push. Can you please help. I am kind of confused why is it giving such different behaviours in these two situations. It would be great if you could throw some light onto this! Thanks. Btw you make great stuff. I am an iOS Developer with 1 year experience and I find your tutorials quite practical. Kudos man! 😎🤘🏻

[@amitkumarghodke5998]

nice learned something new. any plan for multi language app? change language within app?

[@amitkumardas5650]

Hey Brian, please show how to implement ARC in your Instagram Firebase course. IMHO every developer should know do's and dont's w.r.t retain cycles.

[@kevinjefferson9849]

Hello Brian for the shimmer color or is it possible to have 3 or 4 different color layers go over the shimmer label ? And if so how

[@aaravsingh2492]

Hi Brian, nice tutorial as always.. :) one thing I noticed about the animation is that when we touch or swipe or do any gestures on the label the animation lags. Do you also get that?

[@swetajaiswal4222]

Hello, could you please upload a tutorial to test Url response using mocking in swift?

[@kevstuckbykevdotcom2743]

Hi Brian. I love watching your videos. I like how you explain details well. I'm having a problem with this one for some reason. Im trying to apply this to a few UIButtons and its making the buttons not visible at all and no animation. Any thoughts?

[@mcnimi]

i think you can get diagonal gradient directly from the layer like so: gradientLayer.startPoint = CGPoint.init(x: 0, y: 0) gradientLayer.endPoint = CGPoint.init(x: 1, y: 1)

[@LetsBuildThatApp]

Ah yes indeed. My demo uses a -60 degree tilt so that led me to perform the transform instead.

[@iFranKim]

Hey Brian! Awesome tutorial, I was wondering how this was done. Just one quick question, how do I stop and delete the animation? Since this is supposed to replace a UIActivityIndicatorView. I've tried removing the images from it's superview, making it's isHidden property true, but to no avail. I can stop the animation itself with layer.removeAllAnimations() but no matter what i do, the image does not go away. Thank you in advance

[@charlesm.1638]

WOW!!, Can this be added to the launch screen?

[@SSA-X002]

not possible, however you can create a false launch screen copying you launch screen into a new viewcontroller's view, users won't notice the transition.

[@ehawkins730]

GREAT!!!!!!! thanks Brian!

[@MrJoeYellow]

Great tutorial👍

[@tonyd6853]

Wow this is great! Video chat integration next! lol.

[@LetsBuildThatApp]

I haven't figured out what is a good video chat feature yet. I'm not part of the snapchat generation.

[@thorlarson6150]

Just switched to not using storyboards because of your channel and I’m not going back it’s so much easier without them. I’m wondering if you have any plans on doing a slide in menu implementation without storyboards similar to the menu in the KZbin App tutorials except the menu pushes the screen and is not just overlaid on top. Thanks

[@LetsBuildThatApp]

Cool, did you check out the "lets build youtube" series already?

[@thorlarson6150]

Lets Build That App Yep I watched all of them, but in those videos the menu view shows on top of the current view controller. Is there a way to also change the position of the main screen like the menu is pushing the main screen out of the way? (similar to the popular SWRevealViewController)

[@LetsBuildThatApp]

Yeah there are many ways to build out this type of feature. All of which require a video or a long post :)

[@djryanashton]

Great! Thanks :)

[@kav04]

You didn't add - view.addSubview(darkTextlabel) So darkTextlabel doen't work

[@LetsBuildThatApp]

Ah, thats why I wasn't seeing it! The demo definitely has it though :)

[@heyrahulrs]

I was also wondering the same

[@rebellious_703]

I waited till end that Brian will fix it but he forgot. Though its awesome video , thanks

[@gorilka_]

Hey Brian! Why did not you use startPoint and endPoint properties for CAGradientLayer to make it diagonal?

[@LetsBuildThatApp]

For my finished app, I had a 60 degree shimmer. Using start and end point is pretty difficult for performing the correct rotation.

[@doffydonqouite7519]

Good day brian !

[@ronaldojr3948]

This reminds me "Slide to unlock"

[@makyvionkelly3345]

ronaldo Jr on god

[@stevengao8345]

nice tutorial, by any chance would you teach us how to do the animation inside facebook the user tap and hold like button, and a line of faces pop out ? no rush been follow you for almost 1.5 years now, just something to put in your mind. : ) thanks

[@tazihosniomar]

thank you sensei you're the best !

[@RehanAli-es5nh]

Hi Brain! I tried this animation but my animation didn't work in viewDidLoad. I've to place in viewdidAppear. Second i tried facebook shimmer animation with simple view. When i placed in tableview it didn't work but on simple view animation works. Any thoughts on this.

[@Joyceview]

Awesome!!

[@foodcouplelb]

Hello Brian, can you make a video on infinite scroll/ pagination? Thank you

[@LetsBuildThatApp]

Hello Husam, there are some lessons on pagination available here: www.letsbuildthatapp.com/course_video?id=1612

[@cinquain0]

More fire!

[@ZoepX]

Quick question: For the Facebook demo on the right side. Did you use a placeholder cell/view that applies the animation or is it the actual cell/view you use for displaying data with the animation on top of its views? I did it with a place holder cell that reflects loading and then swapped it with actual cell I used once the data has been downloaded from web.

[@LetsBuildThatApp]

You can download the source code for the FB demo with the link in the description. I hacked together two images and put the shimmer animation on top.

[@ZoepX]

Thanks!

[@YogeshPateliOS]

Hello Sir can I upload this video in hindi with your permission ?? I’m also youtuber like you but I’m teaching ios in hindi so please reply sir this video is too good Sir :) thank you

[@LetsBuildThatApp]

Yeah, you should teach the subject with your own style though. The pattern I follow is very unique to the way my brain works, so structure it according to your own cadence.

[@romualdbrochard8674]

`gradientLayer.frame` shouldn't be equal to `shinnyTextLabel.bounds` instead of `shinnyTextLabel.frame`? This works here because the label is pinned on top left of the screen so frame and bounds are equivalent, but if you had a padding on the Label, it would also translate its layer inside

[@foooo294]

Do you have courses for complete beginners ?

[@ehawkins730]

Yes he does...check out the site. There are free courses on there for beginners. Helped me tremendously!. Good luck!!

[@foooo294]

thanks mate

How do you do this in SwiftUI?

[@watchit387]

why the behind label is not visible

[@josetony9181]

Pretty good tutorial!!! I'm an Android developer but I want to switch to iOS, what advices can you give sr.?

[@LetsBuildThatApp]

Just do it.

[@josetony9181]

Thanks sr.

[@Theasstasticvillain]

Is there a way to blend the gradient more?

[@LetsBuildThatApp]

Yeah, you can always play with the location numbers of your gradient or provide more colors.

[@abhijithadkar9451]

Thankss for thiss....great

[@tanhungnguyen1980]

thank you

[@kev8660]

Hey just a question apart of the content of the video, wich video recorder do you use?

[@LetsBuildThatApp]

I use monosnap.

[@kev8660]

Thank you so much

[@---ml4jd]

hello brain. i want to ask you a question please. i want to add some random pictures from the internet in an app. will there be a problem? since i don't own these pictures? what exactly is going on regarding this subject. thank you very much.

[@LetsBuildThatApp]

Hmmm....what do you think?

[@MrTalhakhan01]

I don't know why but I don't feel comfortable with providing depending variables as string (like in keypath : "transform.translation.x").. Great tutorial anyways!

[@LetsBuildThatApp]

I don't think there's any way around this one yet.

[@moalimus]

UPDATE: (I have completed the purchase but after many tries). Thanks man. Paypal button is not working on the website. I wanted to buy a course but it's not responding.

[@LetsBuildThatApp]

I see, were you trying to purchase on mobile?

[@moalimus]

No, desktop.

[@NiteshKumar-bk1wd]

Its work for tableview Xib ??

[@LetsBuildThatApp]

Its work much underd

[@gokhandemirer]

Hi Brian, I want to ask a question that is not relevant to the subject. How does autocomplete work when we write the name of the argument?

[@LetsBuildThatApp]

I just type out the argument names and hope for the best with autocomplete.

[@gokhandemirer]

I understand, but it doesn't work when I use. Thanks

[@dilsmatchanov]

Are you gonna update XCode?

[@LetsBuildThatApp]

I have the latest release version of xcode. My laptop is running beta.

[@dilsmatchanov]

Oh XD. Just I noticed that you have a lot of blank lines at the bottom of your editor.

[@LetsBuildThatApp]

Yeah, it'll be great to be able to just scroll down with the new xcode.

[@MrQouTube]

Is it allowed to use this effect in my own app without marking Facebook as the copyright owner? Or is it just neccessary if you use their library (github.com/facebook/Shimmer)

[@malcolmcollinable]

Siri triggered at 7:59 lol

[@sachinarora7994]

Hey Brian...can I get your Instagram fire base tutorials for free or with some discounts.

[@LetsBuildThatApp]

Hello sachin, the Instagram Firebase course is already at a heavy discount. I'm sure you'll get more than you moneys worth out of all the videos that are available there. Thanks for supporting me and this channel.

[@rlamichhane]

🙂🙂

[@chimansong8653]

I luv u

[@samirdesigner3324]

thanks if make keyboard is good thanks again

[@nizz4m]

You need a haircut sir 😁