Create UICollectionView Like Instagram When Exploring Photos


Hello guys, I hope you're doing well. I was doing research about how to make my UICollectionView like Instagram. As you can see on picture above. I have time to search on the internet but somehow I want to custom it by myself. I mean I don't want to use framework.

After I finished my custom UICollectView, I found IGListKit framework for building fast and flexible lists. But I haven't used it Because I think it's not for custom layout UICollectionView. But if I have much time maybe I will try to use that framework. I think it's cool to use framework that's built by iOS Instagram Developer.

What I want to share is a  custom class UICollectionViewLayout called SavedCollectionViewLayout. Because I used this class to show my saved collection photos. But you can edit the name as you want, no problem at all. But I think there's a room for improvement this class. If you have any idea to improve this code. Tell me. I'm glad I have someone to improve my code quality.
I make sure you already understand UICollectionView literally. And You ever create one eventhough it's simple. But that's all you need basic knowledge and curiosity of course :D. First you need to create your own custom CollectionViewLayout. I named my class SavedCollectionViewLayout. The code I give a long code. And I think you can improve. If I have time I will try to figure it out more.



My main idea is to create 18 different columns. Because we need to handle x,y position and height,width size. We need to use modular to catch same column that has same position or width, so it would not make too much codes. The logic part is in prepare method. Basically we loop every collection cell and we check it where the size and position will be based on IndexPath.

Method getSizeColumn used to set my UIImageView size when I call it in my cellForItemAt UICollectionViewDataSource. Because sometimes the images size is not correct. I just want to make sure my UIImageView size is correct. Sometimes it will show message in console that said our UIImageView size in cell is too big.

So If you have any question, please feel free to ask. Soon I will release my first iOS app on AppStore. So you can see what I build. Maybe you can give a good idea to improve that app. Thanks for visiting my simple blog. Have a nice day guys.

Popular posts from this blog

How to restart the app with flutter Android and iOS

Image
Hi all, welcome back to my blog. And today lesson is about flutter again. I have a little problem when trying to resart the app directly from the app. So what I mean is I want to restart the app after users do something. Because if I don't do it, the app flow will be bad and the data that I want to refresh will be failed. So in my use case in my app is I want to restart the app after user sign in or sign out in my app. The reason is I need to restart all of the previous state. That's the easy way I can do, and I have some problems with camera plugin. The problem is happened only on android, so when you click sign in google/facebook, there'll be new page native from their sdk and making the app in inactive status. That'll will make camera bug, and it will make the app crash.
Read more

Missing system image Android Studio solution

Image
Happy holidays guys, this is december with long weekend haha. I still have a problem with Android Studio. After I update my emulator and suddenly I got a issue that is so weird. You can see picture above I need to redownload emulator from android studio. If you got a issue like me, don't worry and don't uninstall your android studio. It's not complicated to resolve it. You just need to redownload the emulator go to Tools -> AVD Manager. You can see the issue of your emulator and redownload or resolve it. And you will be like image above. Just wait the download and your emulator will be fine again. If you still have the issue, please comment below and let me know what's the problem. I'm happy if i can help you guys. I'm not expert but it's fun when i can solve programming issues.
Read more

How to have ConstraintLayout inside ScrollView and ScrollView inside ConstraintLayout Android

Image
Hai guys, last week I found a unique way to create layout Android look. You can see the title, that's actually what I want. I know it sounds weird but sometimes we need to create something that we might curious if it's in o n the internet or not. Why I'm using ConstraintLayout because it's almost same with iOS xcode. There is constraint where you can set top constraint, bottom constraint, left constraint and right constraint. So it's easy for me to design like what I want. But it's personal, it depends on you too. And fortunely you can combine ScrollView and ConstraintLayout. Because you need to worry when the height of your layout is high than real device height. And if you don't use UIScrollview your component will be unseen when the height of device is more small than layout that we design. Like my app, I want to use ConstraintLayout and ScrollView together. Maybe it can do with RelativeLayout or others layout. But something special that I want i
Read more