macOS Suggestion on How to implement an interface

[CMT]

In the project I'm working on now, I need a list view totally customized, with flexible height so user can click in it and show more info.

Instead of making a more complex description, attached is a screenshot from Things app which has a similar interface for ToDo's.

What would you suggest to implement a similar behavior? Starting from scratch or customizing a table view or outline view?

Thanks!

 

[iindigo]

Note that I have no idea how to set it up properly, but if I'm not mistaken, customizing an NSCollectionView would meet your needs much more nicely than customizing a list or outline view.

 

[CMT]

Note that I have no idea how to set it up properly, but if I'm not mistaken, customizing an NSCollectionView would meet your needs much more nicely than customizing a list or outline view.

Sincerely I didn't know about NSCollectionView existence. I had a look on its tutorial (that Apple did). Looks like it solves the custom list creation easily, but I have to find a way to make the items expandable on click. That might be easy but I'm not that experienced programmer. (any advices would be great)

After some search on the internet I noticed many iPhone programmers have problems creating the same thing, rows in a UITableView expandable. Some call it "spoiler like" others "accordion effect"

 

[Sydde]

Note that NSTableView's delegate method -tableView:heightOfRow: allows you to create tables with rows of varying height. You might be able to just assign a column to the expander arrow button, which value you could use to track which rows are expanded.

 

[dws90]

Investigate NSCollectionView thoroughly before you commit to anything. The class has a lot of rough edges, and can be very, very confusing to get working. It's also not very flexible, so if you're trying to do something other than a textbook case for it, it's likely you could do it more easily from scratch.

 

[CMT]

Note that NSTableView's delegate method -tableView:heightOfRow: allows you to create tables with rows of varying height. You might be able to just assign a column to the expander arrow button, which value you could use to track which rows are expanded.

Initially I was thinking on using this, but I think it would be complicated to completely customize it. Anyway I'll consider it as an option.

Investigate NSCollectionView thoroughly before you commit to anything. The class has a lot of rough edges, and can be very, very confusing to get working.

Indeed I had a closer look in it and some points to consider are:

-Following Apple tutorial I could setup everything with bindings which is great
-The Collection View has an adjustable limit of columns which is great
-There is no default behavior on selecting, meaning one thing less to remove (from a Table View default behavior, for example), great
-I could not find a way to change it's items heigh / opacity from hidden elements. bad

I don't even know if that's possible!

it's likely you could do it more easily from scratch.

That would be more fun, I would like to do that by the way. I've been searching for some examples to get started but none of them told me what I consider the "meat" of the class: stacking one view above the other. Any tips on that would be really appreciated.

Also, what worries me in this case is the memory management. If I start to show a large amount of cells (rows) with probably some graphics in it, wouldn't that represent a problem to memory?

Thank you by the help so far.

 

[dws90]

-I could not find a way to change it's items heigh / opacity from hidden elements. bad

NSCollectionView lets you set the minimum and maximum height of the items. By setting both to the same value, you can force the items to have a certain height. However, all of the items must be the same height - there's no way to increase the height of one without increasing the height of the others. Thus, this probably will not work for you.

That would be more fun, I would like to do that by the way. I've been searching for some examples to get started but none of them told me what I consider the "meat" of the class: stacking one view above the other. Any tips on that would be really appreciated.

Also, what worries me in this case is the memory management. If I start to show a large amount of cells (rows) with probably some graphics in it, wouldn't that represent a problem to memory?

Thank you by the help so far.

By "above", I'm assuming you mean positioned closer to the top of the window, not positioned on top of another view.

Arranging views vertically is not that difficult. Each of the views will need to be a subviews of another view. In the superview, create a method called "layoutSubviews" or something similar. Basically, you need to start at the top (or bottom, if you prefer), and move down the view setting the frame of each subview. So, in pseduocode:

set position to top of view
for each subview
     set subview's frame's y origin to position
     move position down by the height of the subview
end

This will probably be cleanest if you flip the coordinates in the superview.

As for memory management, yes, if you have a lot of subviews, memory use will go up. If "a lot" means ~100, you probably don't have anything to worry about unless your subviews are really complex. If "a lot" means >100,000 then yes, things are going to get more complicated.

 

[CMT]

Thank you for the help dws90.

I've been working on this and it's going to be nice thanks to all your comments