Custom component in Swift - ios

I have a storyboard that I want to reuse many times in my app. You can see it here.
The problem is, I don't know how to use that xib to create a custom component to use it. I will need many instances of that component, and once you click on the UIImageView in the right, or in the label, it will get you to a different scene, depending on which individual instance you clicked. Also, the left UIImageView will be different in every instance.
I have done similar in Android, and now I need to do it in iOS, with Swift.
Ive searched, and almost everything I found its in Objective-C. Does anybody knows about a good tutorial to do it in Swift?
Thank you.
EDIT
More elaborated explanation:
1) I have a scene where I need to put that component, as a whole, four times.
2)In every individual component, I need the image view in the right (the one with the white arrow) and the label to be clickable.
3) In every individual component, the click in the image or the label, will lead to a different screen in the app.
4) In Android, it looks like this. The label and the left ImageView are not seen, since they are set programmatically, but they are there. In the upper component, the click leads to an Activity. In the second one, the click leads to a different Activity, and so on.

From the images and your description, I would still recommend UITableView and custom UITableViewCells. But if you prefer not, ...
To create instances of your component from the XIB file, use the NSBundle "loadNibNamed" method:
let viewArray = NSBundle.mainBundle().loadNibNamed("ClickableComponent", owner:self, options: nil)
let clickableComponent = viewArray[0] as! UIView // or your subclass
You can then tailor programmatically to load the correct images and assign the associated actions.

Related

Same IBOutlet from different storyboards?

I have multiple storyboards in my project, each having an almost identical view controller (only dimensions are different). The storyboard used depends on the device in use. What I want to do is have the equivalent element from each storyboard under the same IBOutlet. This way, whatever I do to an element in the storyboard being used, the same would be done for all other storyboards. This is instead of creating an IBOutlet for the same element in each different storyboard.
For example, we may have two buttons, one in each storyboard. They are meant to be the same button but in different sizes, I set this button's alpha to 0 at one point the in Swift file. How could I do this for both buttons under one name (the same IBOutlet)? I know this means doing something on a storyboard which isn't even being used and therefore not accessible on the device, and I'm not sure whether it'll spit up an error or not. Surely this is a way around this though, because there are apps which use multiple storyboards.
I could imagine possibly stating if (storyboard == xnamex) {execute code for specific storyboard}, but this would mean having multiple if statement with the whole code repeated for different storyboards, and having to create an IBOutlet for each element, which is unrealistic. How would I get around doing this?
Many thanks.
If it's exactly the same button except as you mention the size on it. You can just pull an outlet to the same name and they both will be contained in there. As mentioned [Multiple buttons connected buttons best practise you pull the outlets to the same place and then action to the same place as well. However. Sometimes the action can be tricky, if you get problem there, just create a new action with the exact same name and then remove it. It will still be connected to the same name.

Multiple Photos in slideshow type display within viewController?

I am new to Xcode (started a few days ago).
I'm trying to find a way to get a few photos or videos in a display where the user can scroll or tap through as they desire. There will be multiple viewControllers each with a different set of photos.
Is there any existing UI type data types I can just drag and drop to make this work? Or is this out of range of the capabilities for someone not using code specifically.
I know Java, C, C++, MATLAB, etc. but never have toyed with Objective-C until now. Point being, I should be able to follow any logic you can throw at me, but I'm unfamiliar with the GUI and layout of Xcode as a whole.
This is what I currently have.
This is what I want. Perhaps with functionality to tap to full screen the image or swipe to go to another image. (This image was made with photosop. I don't actually have the picture file in Xcode because I don't know how)
SOLVED: Placed desired images in "Supporting files" content folder inside Xcode. This allowed me to select which photo I want displayed in which ImageView. To fix the proportionality issue where photos in Simulator are far too large, I simply added height and width constraints along with some other centering aspects and got the desired result.
Add UICollectionView in your view and set flow of collection view is horizontal make cell size that you want to keep.
Take a look at UICollectionViewController where you can display multiple cells with embedded views for your images, and consider segueing between them via a UINavigationController.
Edit: Now that you've added screenshots, I'd recommend using a UICollectionView embedded on your subclass of a UIViewController instead of a UICollectionViewController. This should give you more flexibility.

Adding a UIView based on a template in swift?

I've used UITableView before and like the way that the user can add a practically unlimited number of cells by entering information and the program uses a template. I'm wondering if there is a way to do this, but instead of using a table, using regular views or even buttons. For example, the user would tap a button, enter information, and return to the first ViewController and it would have a new view with the information in place of parts of a template that I designed.
Sorry if this is unclear. Basically I'm wondering if there is a way to make a table that is not as restrictive as a table, but uses several individual views in place of cells.
You can create re-usable views in the same way that you can create prototype cells.
Just right click in your project window, add new file and select User Interface > View. create it just like you would a prototype cell.
Then create a related class by adding a new swift file, link the two, create any outlets or actions you need and add any required logic.
Once you are done you can just load it wherever you need it, like so
self.headerView = NSBundle.mainBundle().loadNibNamed("HeaderView",owner:self,options:nil) as! HeaderView
You would likely need to pass in some required information, or setup the views frame or constraints.
I found a YouTube Video which should help guide you through the process. I've only skimmed through it so you may need to look around for a better one, but the general concept seems to be there.

iOS reusable and changeable ViewController

I'm creating an app to increase my knowledge.
I have a ViewController which receives information, and with that information he shows some Views. I've already done something like this but in the end that was a mess and had way too much work to change what I've done.
In my attempt I had some views in the same place as others and just changed the hidden property to NO if I didn't want them to be visible, at the time that was the best option for my knowledge(4 months of iOS) and I thought to myself that must be other ways and better ones to do this type of ViewControllers.
So now comes my question.. What is the best way to do a ViewController which can change accordingly to the information he receives??
A base ViewController and the others are subViews from that ViewController??
Example Updated: I can receive N type of news. Some have an image in the top of the view, others have a scrollview like a photogallery to show more than one image, others can have a title with an image and so on.
Others can have text, others one webview to show a video, others can have a collectionView to show some additional information.
What I would do is have several UIView subclasses. So the setup would look something along the lines of:
YourViewController has a view, that is only there to display subviews
Then depending on the data you receive you instantiate one of your UIView subclasses that are made to display the data you need ( you could also design them in interface builder and access them as a property on your UIViewController ) and add it as the subview to use
Whenever the data needs to change again, remove all the subviews and add the newly needed subview.
ViewController.mainView -> removeAllSubViews -> addNewSubView
Alternatively you could have multiple view controllers I guess, but it kind of depends all on how and what you need your views to do.
For instance if you need more than just a display of data, and some interaction / manipulation of your data you might want to consider using multiple ViewControllers

How to make a login screen like Facebook app?

How can I make a login screen like the Facebook app with "Email" and "Password" textfields?
Facebook Login
I'm really new to iOS programming, sorry if this is an easy question.
First of all you have to understand UIViews and UIViewControllers creation and management.
Then, you could ask your self if you want to create the interface through xib files or programatically. The first way is quite simple. By means of drag and drop operations you could create a user interface in a short time. The second, instead, is more complex for a newbie but I think it could be a valid solution to understand stuffs.
Note that each operation that you do in xib files can be done programatically.
Now, I'll try to explain what elements you need to create that interface.
To create the interface like the following you could create a xib view interface. The view for this interface is the container for your elements. To the container view you could add a UITableView with a grouped style. This UITableView has 2 rows and each row allows to enter text by means of UITextField. To do this, you have to create it programatically. No chance to do it with xib.
Login and signup can be created with two UIButtons. To those buttons you need to attach some actions.
Finally the background image could be set programatically as a background image for your container.
This is a simple description on how to create such an interface. Before starting, I suggest you to read some tutorial on how to:
Use UIView and UIViewController
Create interface trough xib
Interact with interface xib through outlet and actions
Use UITableView and understand its management
Customize or editing UItableViewCell
Use UIImageView and/or UIImage
A good starting point for iOS application development could be www.raywenderlich.com/tutorials.
Hope it helps.
1)In your Xib file..add an image view..set it to the image you want..that will be background like in the Facebook pic.(blue) and that image should include middle (email and password background) part as well.
2) Drag and drop UITextField on it. Make the background custom.
Since you are new..I will point out the details..and then you search on them that way you will understand better :
Search on each of these things on google..cant give info for each.
1)In your Xib file..add an image view..set it to the image you want..that will be background like in the Facebook pic.(blue)
2)The middle part is a UITableViewCell with one section and 2 rows..search on it..
3) And the Log in and sign up are UIButtons..add them in xib and make them IBOutlets..again search on it

Resources