How can I have two view layouts to switch between? (Swift) - xcode

So I have this timer app that I am developing, and there is a setting in it to change from minutes:seconds to hours:minutes:seconds. This means that I need to adjust the UI of the app once the setting is changed. Considering I have constraints on the UI already, how could I do this?
When it is set to minutes:seconds, it displays this:
minutes:seconds
and then when it is set to hours:minutes:seconds, I want the UI to look like this: hours:minutes:seconds
Basically I would like to know the most efficient way to change the UI of the app when an action occurs. Thank you so much in advance!

Create two custom classes -
MinutesView
HoursView
Both will be inheriting from UIView. For each ofttimes classes you need their content which is their subviews. You can do that either programatically or via XIBs. It doesn't really matter.
Inside these subclasses implement the layout with two or three subviews.
Both classes will also have a time variable. Implement a property observer on both. Once a new time is set, update the labels that represent time digits.
Once you have both working. Put them both into your main scene, lay them out however you wish.
The only thing you will have to do when switching between two modes is set the .hidden property on both. Obviously when one is hidden the other one is not and vice versa.

Related

What is the appropriate UI set up for messaging functionality?

I have an app which allows users to send messages to each. The process is accomplished by saving the sent messages in a local SQLite database, while actually sending the messages to a database and using push notifications to send the message to the recipient's SQLite database. The set up I have works fine. However, what I am confused about is how to set up the actual interactive UI for the user (I am using XCode). I figured it should be a UITableView with each table cell representing a message. However, with this approach I run into a few requirements:
Variable TextView Sizes
Just as with regular iOS messaging, the TextView's size needs to be variable, adjusting its dimensions to fit all of the text in each message. I do not know how to accomplish this. I have a general understanding of how to generally vary sizes, but no clue how to dynamically have it based on the text within that view.
Variable TextView Positions
Again, just as with regular iOS messaging, the textview needs to be offset to either the right or left side depending on whether the sender was the user or who the are conversing with, respectively. I also do not know how to do this, because it changes the center of the textview.
Non-selectability
Xcode allows cells to be pressed. Handling what happens after this selection can be achieved by the didSelectRowatIndexPath tableView function. I can simply not implement this, but clicking on the cell causes it to turn darker to indicate it has been pressed. I would like to eliminate this while retaining the ability to, say, select some of the text and copy and paste it or whatever (just like messaging works normally on your phone).
Other Approaches?
This is the real meat of the question. I have considered the above approach because that is all that I have been able to come up with based on my limited experience with XCode UI elements. If there is a better approach (perhaps even a pod or framework) for this purpose I would love to hear it. I do not need the messaging UI to look amazing, just clean and crisp.
I suggest the following:
Variable TextView Sizes:
I assume you do use auto layout. If you don’t yet, please consider using it since it make life much easier!
If you use a UITableView, you can adjust the height of its UITableViewCells dynamically, depending on the actual content by using self-sizing cells. You can find a tutorial how to do this here.
Variable TextView Positions:
I assume you have a UITextView within a table view cell. In this case, you have to set auto layout constraints to the borders of the cell’s contentView. If you define a custom subclass of a UITableViewCell, you can define in this class 2 IBOutlet properties that are linked to say the left and the right layout constraints (e.g. var leftLayoutConstraint: NSLayoutConstraint). Then, you can set the constraint’s constant property as required when the cell is laid out, i.e. in the layoutSubviews function of the custom table view cell.
Non-selectability:
I am not sure what you mean by „I can simply not implement this“. Please make sure that you set the delegate property of the UITableView to the view controller where you want to handle cell selection. Selecting a cell changes the cells color by default, but you can change this: In the storyboard, select your table view’s prototype cell, and open Xcode’s utility pane (top rightmost button). Under „Table view cell“ you find „Selection“ that you can set to „None“.
I hope this helps!

WebComponents-like objects (or nested controls) in Xcode

I created a custom NSView that displays some data exactly the way I want it to (a line chart of sorts). I now want to add a couple of sliders to have the ability to zoom the displayed data in and out. I would also like to add a couple of checkboxes so that the incoming data can be interpreted and graphed in different ways, and maybe some scrollbars to be able to see past data. I need to have at least 5 copies of this view (with all its controls) on screen at the same time, each showing a different data feed.
This way of thinking a user interface falls nicely into the WebComponents paradigm where you can design a component that encapsulates many different ones. As I understand it, there is no way of nesting controls like this into a master control in Xcode.
Of course I could layout all the views and all the controls separately inside a view controller and achieve exactly what I want but it would not be as maintainable as having ONE object that I can duplicate either in interface builder or in code.
My question is: what is the proper way to achieve this in Xcode (if any)? I don't need code examples but rather a conceptual answer and I'm only interested in answers related to Cocoa rather than CocoaTouch.
I just learned that you can have multiple view controllers as child controllers. This is exactly what I was looking for as it maximizes reusability and reduces maintenance.

The same UIView in two places at once?

In order to explain what problem I am having I will quickly explain the scenario. I have a synthesizer I am building that has several "control views". One control view may be 4 vertical sliders while another is one big matrix or something.. So, say I have control views 1-4. In addition, I have two main sections (which are just holder views), which can contain one of the 4 control views. At any given moment, sectionA can have controlView4 while sectionB can have controlView2. This works perfectly.
The problem with this is SectionA cannot have ControlView1 while SectionB has ControlView1 simultaneously. This leads to undesirable behavior. For example, if SectionA currently has ControlView1 while SectionB has ControlView4 (which will wrap around to ControlView1 on the next toggle), than the next time I toggle SectionB's active ControlView, SectionA's ControlView will simply disappear. (presumably because UIKit implicitly removes it from SectionA's subviews when I add it as a SectionB's subview.)
So, there is some default behavior of UIView that isn't ideal for this modular scheme I wish to implement. That being said, is there a way to achieve what I want without deviating to far afield from iOS best practices and sane code design?
First, I would want to have a different type of view controller for each type of view. Then, each time I wanted a view in a section, I would create its matching controller and have it take over that container area. If the four sections are then displaying multiple copies of the same view, they each have their own controller to keep them organized.
Assuming you have your data model separate from your views and controllers, there should be no extra complexity.

Split view divider is not showing up when subclassing from NSSplitView

I created a custom SplitView class that subclasses from NSSplitView. Everything looks right to me, and works fine, except the divider. For some reason it doesn't want to show up between my views of a SplitView.
Any kind of hint or help is highly appreciated!
here is my setup in the nib:
and here how it looks when I run it
interesting thing is, that when I move the mouse to the place where the divider should be, the cursor changes and I'm able to drag it...but for some reason it doesn't look right
You can change the color of the divider using the 'drawDividerInRect:' function to change the color of the divider by passing your own rectangle. It is also possible you moved one of the custom views in the split view and can't see the divider anymore. You could try selecting the different views using the object hierarchy.
I've found that apple doesn't like to make it easy to modify a lot of their different views and controllers, probably because they are trying to maintain some uniformity in the apps that are run on their system.
Is the hidden check box checked?

Programmatically create UI or drag and drop in storyboard for iOS development

First time building a user interface, had a few general questions
1) Does it really matter if you drag and drop view objects into view controller.. or if you programmatically add subviews and specify frames and fonts? What's the better approach to take?
2) In the programmatic approach, I end up guessing frame values, (x,y) points, and then checking in simulator if I like it. Is this the right approach, or are there faster, better ways to build out the UI? Maybe methods I'm not aware of?
3) Any useful tutorials/pointers in the right direction on how to get started?
Thanks!
1) Both approaches are fine, but the Interface Builder is usually better if you have a more static UI. In a more dynamic app (where views appear and disappear, or if you use UIViewController containment), you need to add/show/hide some of the views in the code. Even in that case you can design individual views in the IB, to make sure they look good, and then instantiate and display them in the code.
2) If you design your views in the IB, then the problem of guessing the sizes largely disappears. In some cases it can be useful to have an empty view added in the IB, which acts as a placeholder for your dynamic content. Then, when you add a view to it in the code, you just use the superview's dimensions so your view fills the placeholder.

Resources