How to make a menu looking like the one in QuizUp - ios

I gave a look on QuizUp and I would like to make a similar menu on my iphone application.
I don't understand how they made the menu. It looks like a table view controller, but a new menu appears under the cell when the user tap on it.
Can someone give me some clues. Is it possible to do that with the native iOS SDK ? How ?

According to the developer of Quiz Up, the app was made using Cocos2D.
That being said, it is also possible to do it using a UITableView. Theres just a couple things you would need to do. The first is get tableView:heightForRowAtIndexPath: to return a different height for the row(s) you want to be expanded. For example, if you only want one row expanded you could use the following.
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
if ([[tableView indexPathForSelectedRow] isEqual:indexPath]) {
return 100.0f;
}
return 44.0f;
}
Then what you need to do is call beginUpdates and endUpdates on your tableview whenever you want the height to update.
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
[tableView beginUpdates];
[tableView endUpdates];
}
After that, you just need to layout your cell so that when it's expanded, it shows the additional view and when its collapsed it should hide that view.

Related

iOS Expanded/Selected Custom UITableViewCells state changes when scrolling UITableView

I have a list of custom cells in my tableview and as I scroll everything appears to fine and the cells appear to be in the same order. I have some functionality with my cells - as i select a cell (and it dynamically expands)the background color changes and a few other custom cell properties. Once I do this and then I start scrolling, different cells that i haven't even touched before show up, selected(expanded) and the cell only updates when I select it manually to the correct data. I seem to see duplicates and all kinds of craziness.
I know there are LOTS of posts about this on here so far but for me, so far nothing has worked. Would like some input on what I could do to stop this ridiculous behavior.
I have posted some code to give you a better idea of what I am doing. I know that 'dequeueReusableCellWithIdentifier' is the culprit but don't know of an alternative.
As side notes, this is a tableview(its own xib) that is a child view of a large view (also a xib). I have also already registered the nib for the tableview.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
MyCustomCell *cell = [tableView dequeueReusableCellWithIdentifier:myIndentifier forIndexPath:indexPath];
if(self.currentSelectedIndex){
if(self.previousSelectedIndex){
//collapse cell
//configure cell in method(change background color etc)
}
else{
//expand cell
//configure cell in method(change background color etc)
}
}
}
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
self.currentSelectedIndex = indexPath;
[tableView beginUpdates];
if(self.currentSelectedIndex){
if(self.previousSelectedIndex && (self.previousSelectedIndex != self.currentSelectedIndex)){
[tableView reloadRowsAtIndexPaths:#[self.currentSelectedIndex, self.previousSelectedIndex] withRowAnimation:UITableViewRowAnimationAutomatic];
}
else{
[tableView reloadRowsAtIndexPaths:#[self.currentSelectedIndex] withRowAnimation:UITableViewRowAnimationAutomatic];
}
}
[tableView endUpdates];
if(self.previousSelectedIndex == self.currentSelectedIndex){
self.previousSelectedIndex = nil;
}
else{
self.previousSelectedIndex = self.currentSelectedIndex;
}
}
What can I do or how would i make sure that nothing else in the list 'seems' to be selected(expanded) or prevent from appearing to see duplicates as i scroll? I already keep track of my current and last selected index(as shown in the code) so I suppose that I could use that somehow?
Dequeued Cells are Reused
Know that cells are re-used, so that the appearance of a UITableViewCell is persistent for the entire life of that cell.
This means that if you do not explicitly reset all the presentation view of your cell, and just returning it unchanged in cellForRowAtIndexPath, what you are returning may be a currently selected (or deselected) cached cell.
A possible location to reset a table cell is prepareForReuse.
Design note:
How are you maintaining self.currentSelectedIndex and self.previousSelectedIndex? This is typically quite dangerous, since you are attempting to replicate the UITableView behavior. It is for example, unlikely to work with multiple selection. Setting an active selection is unlikely handle situations when the OS didDeselectRowAtIndexPath, as a result of a keyboard dismissal for example.

Xcode remove cell with animation programmatically

Hi i have been searching around to find a way to remove a static cell with animation but i have not found a solution to the problem.
I have also tried: [tableView deleteRowsAtIndexPaths:[self.taskArray objectAtIndex:indexPath.row] withRowAnimation:UITableViewRowAnimationFade];
but no success.
You need to hide cell before it is shown, in UITableViewDelegate's tableView:willDisplayCell:forRowAtIndexPath: method. This is the last method in your control where you can manipulate the cell display. It does not remove the space the cell takes, so another thing you can try is to set cell row's height to 0 using the tableView:heightForRowAtIndexPath: method of the same protocol.
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
UITableViewCell *cell = [super tableView:tableView cellForRowAtIndexPath:indexPath];
if (yourCell) {
return 0;
} else {
return [super tableView:tableView heightForRowAtIndexPath:indexPath];
}
}
As your tableview is static, you cannot use deleteRowsAtIndexPath. The best option would probably be to migrate your data into a dataSource method for the tableview.
If this is impossible, then this answer ("UITableView set to static cells. Is it possible to hide some of the cells programmatically?") gives that the best method is to use the third party library
StaticDataTableViewController 2.0 (https://github.com/xelvenone/StaticDataTableViewController).
Otherwise you have to use the somewhat hacky method of changing the row height to 0.

Cell overlaps and shows full content while editing

I am using cells with two heights based on some status.
When start is StatusAwarded it shows full cell else it will show a part of it.
Here is the code to achieve this.
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
SomeClass *someClass = dataArray[indexPath.row];
if (someClass.status == StatusAwarded) {
return 252.0f;
}
return 110.0f;
}
It works all fine but when it is in edit mode, it has this issue as shown below.
I am having effect like this while editing (Deleting).
Question:
Why is this happening? How to fix this?
Note: Clip Subviews is set to YES
Try to enable Clip Subviews in Interface Builder / Storyboard.
You're not reloading the other cells, try:
[tableViewAdvancedBookings reloadRowsAtIndexPaths:[indexPathsToExpand allObjects] withRowAnimation:UITableViewRowAnimationAutomatic];
instead of:
[tableViewAdvancedBookings reloadRowsAtIndexPaths:#[indexPath] withRowAnimation:UITableViewRowAnimationAutomatic];
which only reload the currect selected cell..
or maybe try reloading the whole table like:
[tableView reloadData];
and see what happen.. hope i've help, for some reason.. Good night, Cheers..

Picture in Table View Cell Not Showing

In this project I have absolutely no code. In my main.storyboard I have a TableViewController with so far 1 cell. In that one cell I put an Image View in, then I selected the certain picture. The cell is 320 (Width) by 44 (Height). Everything seems fine in the main.storyboard, however I press run, the app opens but there is nothing there, only a bunch of lines.
Any help would be great I will give screenshots to anyone who needs them in order to help me solve this problem. I am using xCode 5.1
If you don't want to write any code than you must tableView type to static!
Check that.
Here's the snippet for TableViewDelegate. Hope this will help. Don't forget to thumbs up
Make sure you have this in your TableView
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
return 1; ---->> should return 1
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return 10; ----->> return how many rows you want to show, mostly you write
return yourarray.count;
}
I think the problem will be in the method below
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
UITableViewCell *cell = nil; ---->> Instead of UITableViewCell you need to
change to the class name of the
TableCell ( This is where your cell is
created)
cell = [tableView dequeueReusableCellWithIdentifier:#"Cell"];
if(!cell){
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle
reuseIdentifier:#"Cell"]; ---->>Instead of UITableViewCell you need to
change to the class name of the
TableCell ( This is where your cell is created)
}
cell.textLabel.text = #"Cell";
return cell;
}
You have to use either a static tableview that uses predefined cells or (by default) use a dynamic tableview - in that case you have to provide the cells in code by adhering to the tableviews data source protocol. Which you seem to not be doing now.
So, in interface builder, set the tableview to be static and you can build the cells in interface builder and they will be displayed. Make sure you delete the boilerplatecode in table viewcontroller that is given to you to easily implement the protocol (if you don't delete it, the default code returns nil off the cells and so none will get displayed).
When you get it working, find a nice tableview tutorial. I suggest ray wenderlich or the cs193p course on itunesU.

Separator line showing up after selection of last row in section

I'm seeing a weird behavior in all of my UITableView's. This is starting to drive me nuts.
I have plain styled UITableViews. The last row in the section doesn't get a separator, it just blends in to the section header (default usage by the way). Checking the height of this last row, it appears Apple is making it 1px larger to remove the separator height from the cell. The problem is when I select the row, but drag off, the separator line shows up and never goes away. If I go back a view and come back in, it defaults to off.
I'm seeing this across all of my table views, normal cells and custom cells. What can I do to make sure this last separator stays away when I cancel a selection? iOS 7 only build. Running current builds, no betas.
For me reloading of cell helped for some separator line problems:
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
[self.tableView deselectRowAtIndexPath:indexPath animated:YES];
[tableView reloadRowsAtIndexPaths:#[indexPath] withRowAnimation:UITableViewRowAnimationNone];
}
- (void)tableView:(UITableView *)tableView didUnhighlightRowAtIndexPath:(NSIndexPath *)indexPath
{
[tableView reloadRowsAtIndexPaths:#[indexPath] withRowAnimation:UITableViewRowAnimationNone];
}
If you change the style of the tableView in the storyboard from plain to grouped, you won't get this behavior. It will give you a section header above your section though. To get rid of it, do this -
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
return 0.01f;
}

Resources