Adjusting height of Today App Extension - user-interface

I have a Today Widget which displaying the upcoming train departures based on a pair of stations chosen in the main application. Given that the departure times changes with time, I have an API call in viewWillAppear fetching the new times and repopulating the cells of a tableView.
Currently, the widget starts off with a height of what looks like 150-200 points in height. My updating logic attempts to set the preferredContent height but this doesn't work. I have the tableView constrained to the top/bottom layout guides. I have tried resetting the tableView's frame height to the main view after telling it a new preferredContent.
Presumably, the callback of my network happens after viewWillAppear, so I invoke layoutIfNeeded to trigger viewDidLayoutSubviews where I reload the tableview.
None of this gets me what I want to see. A tableview populated by the departure times which is N times the height of a cell where N is the number of departure times most recently fetched by my API call.
What am I missing? Any help would be greatly appreciated.
EDIT:
This is the relevant code where I attempt to re-height the extension.
override func viewWillAppear(_ animated: Bool) {
dao.fetchTrips { (trips) in
self.tripsDataSource.dataStore = trips
let numTrips = trips?.count
let rowHeight = 44 // static
let h = numTrips! * rowHeight
self.preferredContentSize = CGSize(width: 0, height: h)
self.view.layoutIfNeeded()
}
}
override func viewDidLayoutSubviews() {
self.tableView.reloadData()
}
I have noticed viewDidLayoutSubviews is not called after layoutIfNeeded is invoked in the completion handler. Although that may not be the issue, as the app-extension main view does not change after setting a new preferredContentSize.

I had the same problem. Few minutes ago I solved it. The default view of widget doesn't show the max height. You need to press show more , next to App title.
Remove your code and just add this to your widget class and on else branch set the height what you want. This will call when you hit show less/ show more.
#available(iOSApplicationExtension 10.0, *)
func widgetActiveDisplayModeDidChange(_ activeDisplayMode: NCWidgetDisplayMode, withMaximumSize maxSize: CGSize){
if (activeDisplayMode == NCWidgetDisplayMode.compact) {
self.preferredContentSize = CGSize(width: 0, height: maxSize.height);
}
else {
self.preferredContentSize = CGSize(width: 0, height: self.tableView.contentSize.height);
}
}
Edited: My code:
import UIKit
import NotificationCenter
let groupappname = "group.***.***"
class MyCollectionViewController: UICollectionViewController , NCWidgetProviding,UICollectionViewDelegateFlowLayout {
var isEmptyData = true
var array = NSMutableArray()
var defaults = UserDefaults.init(suiteName: groupappname)!
override func viewDidLoad() {
super.viewDidLoad()
if #available(iOSApplicationExtension 10.0, *) {
self.extensionContext?.widgetLargestAvailableDisplayMode = NCWidgetDisplayMode.expanded
} else {
// Fallback on earlier versions
}
registerObserver()
refreshData()
}
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
removeObserver()
}
func refreshData(){
self.preferredContentSize = (self.collectionView?.contentSize)!
#somecode
self.collectionView?.reloadData()
}
func refreshData_NoData(){
self.preferredContentSize = (self.collectionView?.contentSize)!
self.collectionView?.reloadData()
}
func widgetPerformUpdate(completionHandler: #escaping (NCUpdateResult) -> Void) {
print("widgetperformupdate")
completionHandler(NCUpdateResult.newData)
}
#available(iOSApplicationExtension 10.0, *)
func widgetActiveDisplayModeDidChange(_ activeDisplayMode: NCWidgetDisplayMode, withMaximumSize maxSize: CGSize){
if (activeDisplayMode == NCWidgetDisplayMode.compact) {
self.preferredContentSize = CGSize(width: 0, height: maxSize.height)
}
else {
self.preferredContentSize = CGSize(width: 0, height: (self.collectionView?.contentSize.height)!)
}
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
// MARK: UICollectionViewDataSource
override func numberOfSections(in collectionView: UICollectionView) -> Int {
// #warning Incomplete implementation, return the number of sections
return 1
}
override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
// #warning Incomplete implementation, return the number of items
return array.count
}
override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
#somecode
self.preferredContentSize = collectionView.contentSize
return cell
}
}

Related

Increasing `collectionViewContentSize` width causes CollectionView Cells to disappear

So I have an issue I've been battling with for days now. I have a collectionView which is designed to have large cells (width-wise) which go off screen. The height is fixed. The idea is to basically scroll to the end (see below):
To achieve being able to scroll left and right, I've had to override the width inside collectionViewContentSize in my flowLayout. Like below.
override var collectionViewContentSize: CGSize {
var size = super.collectionViewContentSize
size.width = largeWidth
return size
}
This achieves increasing the horizontal scroll area (which is what I want) but the cells start to disappear once I reach a certain point. It's almost as if the cells are being dequeued when they shouldn't be. Any ideas on this. This is the final straw for my project but I'm out of ideas.
Many thanks
Code snippet can be found below. You should be able to just copy and paste this into any project:
class HomeViewController: UIViewController {
let collectionView: UICollectionView
let collectionViewLayout = CustomCollectionViewFlowLayout()
init() {
collectionView = UICollectionView(frame: .zero, collectionViewLayout: collectionViewLayout)
super.init(nibName: nil, bundle: nil)
collectionView.backgroundColor = UIColor.red.withAlphaComponent(0.4)
collectionView.register(SomeCell.self, forCellWithReuseIdentifier: "SomeCell")
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
collectionView.delegate = self
collectionView.dataSource = self
}
override func viewDidLoad() {
super.viewDidLoad()
collectionView.frame = view.bounds
view.addSubview(collectionView)
}
}
class SomeCell: UICollectionViewCell {
}
extension HomeViewController: UICollectionViewDataSource,
UICollectionViewDelegate,
UICollectionViewDelegateFlowLayout {
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 150
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "SomeCell", for: indexPath) as! SomeCell
cell.backgroundColor = .blue
return cell
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
return CGSize(width: 10000, height: 70)
}
}
class CustomCollectionViewFlowLayout: UICollectionViewFlowLayout {
override var collectionViewContentSize: CGSize {
var size = super.collectionViewContentSize
size.width = 10000
return size
}
}

iOS 11 reloadSections create duplicate header section

I'm working on a company's project and I have this problem when testing my table view on iOS 11 GM. It did work well on iOS 10. It is simple, I have three sections with header. When I tap on section header, my section will collapse/extend. Here's how I do it:
ViewController:
class ViewController: UIViewController {
#IBOutlet weak var tableView: UITableView!
var sectionsOpened: [String: Bool] = [
"section1": true,
"section2": true,
"section3": true
]
func isSectionOpened(section: String) -> Bool {
return sectionsOpened[section]!
}
#objc func toggleSection1() {
sectionsOpened["section1"] = !sectionsOpened["section1"]!
toggle(sectionIndex: 0)
}
#objc func toggleSection2() {
sectionsOpened["section2"] = !sectionsOpened["section2"]!
toggle(sectionIndex: 1)
}
#objc func toggleSection3() {
sectionsOpened["section3"] = !sectionsOpened["section3"]!
toggle(sectionIndex: 2)
}
func toggle(sectionIndex: Int) {
self.tableView.reloadSections([sectionIndex], with: .automatic)
self.tableView.scrollToRow(at: IndexPath(row: 0, section: sectionIndex), at: .top, animated: true)
}
Table view dataSource:
extension ViewController: UITableViewDataSource {
func numberOfSections(in tableView: UITableView) -> Int {
return 3
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 1
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "testCell", for: indexPath)
let label = cell.viewWithTag(1) as! UILabel
label.text = "TEST \(indexPath.section) - \(indexPath.row)"
return cell
}
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let headerView = UILabel(frame: CGRect(x: 0, y: 0, width: 320, height: 60))
headerView.backgroundColor = UIColor.green
headerView.text = "Header \(section)"
var gesture: UITapGestureRecognizer?
if section == 0 {
gesture = UITapGestureRecognizer(target: self, action: #selector(toggleSection1))
} else if section == 1 {
gesture = UITapGestureRecognizer(target: self, action: #selector(toggleSection2))
} else if section == 2 {
gesture = UITapGestureRecognizer(target: self, action: #selector(toggleSection3))
}
headerView.addGestureRecognizer(gesture!)
headerView.isUserInteractionEnabled = true
return headerView
}
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
return 60
}
func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return CGFloat.leastNormalMagnitude
}
Table view delegate:
extension ViewController: UITableViewDelegate {
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
if !isSectionOpened(section: "section\(indexPath.section+1)") {
return 1
}
if indexPath.section == 0 {
return 350
} else if indexPath.section == 1 {
return 400
} else if indexPath.section == 2 {
return 350
}
return 500
}
First notice is that scrollToRow behave weird, it go to top, then scroll down to the position.
Then, after trying to open/close the 3 headers, scrolling up/down, sometimes I got this duplicate header problem:
Duplicate header when reloading sections (photo)
'
Thank you in advance for your help. I really need to make this to work because iOS 11 will come next Tuesday...
I had the same problem and fixed it by using:
self.tableView.estimatedRowHeight = 0;
self.tableView.estimatedSectionHeaderHeight = 0;
self.tableView.estimatedSectionFooterHeight = 0;
The issue has to do with the estimated row height when using self sizing cells. It seems if we do not provide very accurate estimations a couple of issues may appear across different version of iOS when reloading table view rows. On iOS 9 and 10 the table view may jump towards the top. On iOS 11 it seems section headers may duplicate if they are sticky at the top when reloading a row.
One solution is to cache the hight of the row as it is displayed and then provide this height back to the tableview as the estimated height, when required. Annoying to have to resort to something like this, but it solves both issues for me across iOS 9, 10 and 11.
See also this issue

Can't get UITableViewAutomaticDimension to work properly

I have a fairly standard UITableView that populates via custom cell. That cell is simply an image and a label at the moment. I cannot, for the life of me, get it to resize on it's own.
When I include UITableViewAutomaticDimension, I lose the ability to populate my data in addition to incorrect layouts.
Without UITableViewAutomaticDimension, the data is displayed properly.
I am using SnapKit to handle constraints and Meteor/SwiftDDP to handle the data, but there is another UITableView in the project that seems to be working properly
ViewController
class CommentViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
var commentTable:UITableView!
var comments:MeteorCollection<Comment>!
init() {
super.init(nibName: nil, bundle: nil)
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func viewDidLoad() {
super.viewDidLoad()
comments = MeteorCollection<Comment>(name: "comments")
createView()
Meteor.subscribe("postsComments", params: [["postId": self.source!.id!]]) {}
}
func createView() {
let contentTableView = UITableView(frame: content.frame)
content.addSubview(contentTableView)
contentTableView.backgroundColor = UIColor.clearColor()
self.commentTable = contentTableView
contentTableView.delegate = self
contentTableView.dataSource = self
contentTableView.snp_makeConstraints { (make) -> Void in
make.top.equalTo(content)
make.left.equalTo(content)
make.right.equalTo(content)
make.height.equalTo(content).inset(65)
}
contentTableView.rowHeight = UITableViewAutomaticDimension
contentTableView.estimatedRowHeight = 350
}
}
CommentTableViewDelegate.swift
import UIKit
extension CommentViewController {
func numberOfSectionsInTableView(tableView: UITableView) -> Int {
return 1
}
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.comments.count
}
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCellWithIdentifier(CommentTableViewCell.reuseIdentifier, forIndexPath: indexPath) as UITableViewCell
cell.setNeedsUpdateConstraints()
cell.updateConstraintsIfNeeded()
if let card = cell as? CommentTableViewCell {
let item = self.comments.sorted[indexPath.row]
card.populate(item)
}
return CommentTableViewCell()
}
func reloadTableView() {
self.commentTable.reloadData()
}
}
An example of my garbled mess when not using UITableViewAutomaticDimension
An example of my garbled mess when using UITableViewAutomaticDimension
It might be due to improper constraint within cell. Please add constraint properly in table view cell and set these two properties of UILable from Attributes inspector section of storyboard:
lines to 0
Line break to word wrap
or you can also set these properties from code:
self.lblxyz.numberOfLines = 0
self.lblxyz.lineBreakMode = .byWordWrapping
Note - Do not fix the height of UILable.
Hope it will help you... :)
I'm not sure if it works but, I've been through the same problem recently, and i fixed it by changing the estimatedRowHeight .
Can you please try once with:-
contentTableView.estimatedRowHeight = 350
to, contentTableView.estimatedRowHeight = 160

How to display label when table view is empty

I am trying to figure out how to display a message within a table view when the table is empty. I would like it to say something like: "You haven't added any transactions yet. Tap the add button to get started.". Obviously I would need it to revert back to this message if the user deletes all of the cells, too.
This is the code that I currently have in my table view controller:
class ThirdViewController: UITableViewController {
override func viewWillAppear(animated: Bool) {
self.tableView.reloadData()
}
override func viewDidLoad() {
super.viewDidLoad()
// Uncomment the following line to preserve selection between presentations
// self.clearsSelectionOnViewWillAppear = false
// Uncomment the following line to display an Edit button in the navigation bar for this view controller.
// self.navigationItem.rightBarButtonItem = self.editButtonItem
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
// #pragma mark - Table view data source
override func numberOfSectionsInTableView(tableView: UITableView?) -> Int {
// #warning Potentially incomplete method implementation.
// Return the number of sections.
return 1
}
override func tableView(tableView: UITableView?, numberOfRowsInSection section: Int) -> Int {
// #warning Incomplete method implementation.
// Return the number of rows in the section.
return arrayObject.paymentsArray().count
}
override func tableView(tableView: UITableView!, cellForRowAtIndexPath indexPath: NSIndexPath!) -> UITableViewCell! {
var cell:CustomTransactionTableViewCell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath) as CustomTransactionTableViewCell
cell.paymentNameLabel.text = (arrayObject.paymentsArray().objectAtIndex(indexPath.row)) as String
cell.costLabel.text = (arrayObject.costArray().objectAtIndex(indexPath.row)) as String
cell.dateLabel.text = (arrayObject.dateArray().objectAtIndex(indexPath.row)) as String
if arrayObject.imageArray().objectAtIndex(indexPath.row) as NSObject == 0 {
cell.paymentArrowImage.hidden = false
cell.creditArrowImage.hidden = true
} else if arrayObject.imageArray().objectAtIndex(indexPath.row) as NSObject == 1 {
cell.creditArrowImage.hidden = false
cell.paymentArrowImage.hidden = true
}
return cell
}
override func tableView(tableView: UITableView!, canEditRowAtIndexPath indexPath: NSIndexPath!) -> Bool {
return true
}
override func tableView(tableView: UITableView!, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath!) {
if (editingStyle == UITableViewCellEditingStyle.Delete) {
if let tv=tableView {
arrayDataCost.removeObjectAtIndex(indexPath!.row)
arrayDataImage.removeObjectAtIndex(indexPath!.row)
arrayDataPayments.removeObjectAtIndex(indexPath!.row)
arrayDataDate.removeObjectAtIndex(indexPath!.row)
tv.deleteRowsAtIndexPaths([indexPath], withRowAnimation: .Fade)
}
}
}
}
Any help would be much appreciated!
You might want to set the backgroundView to a UILabel (Or some view you made when the table is empty
override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
if self.numberOfRow == 0{
var emptyLabel = UILabel(frame: CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height))
emptyLabel.text = "No Data"
emptyLabel.textAlignment = NSTextAlignment.Center
self.tableView.backgroundView = emptyLabel
self.tableView.separatorStyle = UITableViewCellSeparatorStyle.None
return 0
} else {
return self.numberOfRow
}
}
something like this works fine for me
func numberOfSectionsInTableView(tableView: UITableView) -> Int {
var numOfSection: NSInteger = 0
if array.count > 0
{
self.tableView.backgroundView = nil
numOfSection = 1
}
else
{
var noDataLabel: UILabel = UILabel(frame: CGRectMake(0, 0, self.tableView.bounds.size.width, self.tableView.bounds.size.height))
noDataLabel.text = "No Data Available"
noDataLabel.textColor = UIColor(red: 22.0/255.0, green: 106.0/255.0, blue: 176.0/255.0, alpha: 1.0)
noDataLabel.textAlignment = NSTextAlignment.Center
self.tableView.backgroundView = noDataLabel
}
return numOfSection
}
Override your viewDidLoad() method like this:
override func viewDidLoad() {
super.viewDidLoad()
self.view.addSubview(self.yourLabel);
if arrayObject.paymentsArray().count > 0 {
self.tableView.hidden = NO;
self.yourLabel.hidden = YES;
} else {
self.tableView.hidden = YES;
self.yourLabel.hidden = NO;
}
}
You can either hide the tableView and unhide the label, or display some sort of animation that reduces the alpha of one of the views for a 'fade' effect.
You can use this method. No function limit
Swift3
if tableView.visibleCells.isEmpty{
//tableview is not data
print("can not found data")
}else{
//do somethings
}
I needed to achieve the same thing. This is what i did.
var label: UILabel {
let label = UILabel(frame: tableView.bounds)
label.text = "empty"
return label
}
override func viewDidLoad() {
tableView.backgroundView = UIView(frame: tableView.bounds)
tableView.backgroundView?.addSubview(noPlacesMessageLabel)
}

how do I remove the space between cells of an NSTableView?

I have set the intercell spacing in my NSTableView to 0 by sending:
[self.tableView setIntercellSpacing:NSMakeSize(0, 0)];
in the window controller's awakeFromNib but there is still an (possibly 1 pixel wide) empty space between the rows, which I think is where the grid lines are drawn although I'm not using the grid lines. How can I get rid of this space between the rows?
update:
The NSTableView documentation seems to say that this 1 pixel separation should go away when the intercell separation is set to 0, 0. In my case, its not. Maybe it's a bug?
As suggested by trudyscousin, I'll post how I fixed my problem:
As it turns out, the empty space does in fact disappear when you set the intercell spacing to 0 as I did. My problem was that the drawing code in my NSTableCellView subclass wasn't drawing all the way to the edge of the view. The gap I was seeing wasn't the intercell separation, it was the border of my NSTableCellView subclass.
In my case the task was to have 0.5 pt (1 px on Retina display) separator. Seems even when intercellSpacing set to .zero (or 0.5 pt in my case) AppKit still preserving 1 pt space between rows when drawing selection.
I ended up by subclassing NSTableRowView. With custom row I can set separator to any height. Here is a Swift 4.2 example:
class WelcomeRecentDocumentsView: View {
private lazy var tableView = TableView().autolayoutView()
private lazy var scrollView = ScrollView(tableView: tableView).autolayoutView()
override var intrinsicContentSize: NSSize {
return CGSize(width: 240, height: 400)
}
private var recentDocumentsURLs = (0 ..< 10).map { $0 }
}
extension WelcomeRecentDocumentsView: NSTableViewDataSource {
func numberOfRows(in tableView: NSTableView) -> Int {
return recentDocumentsURLs.count
}
func tableView(_ tableView: NSTableView, viewFor tableColumn: NSTableColumn?, row: Int) -> NSView? {
return tableView.makeView(ItemView.self)
}
}
extension WelcomeRecentDocumentsView: NSTableViewDelegate {
func tableView(_ tableView: NSTableView, rowViewForRow row: Int) -> NSTableRowView? {
// Returning custom RowView.
return RowView(separatorHeight: separatorHeight, separatorColor: tableView.gridColor)
}
}
extension WelcomeRecentDocumentsView {
private var separatorHeight: CGFloat {
return convertFromBacking(1)
}
override func setupUI() {
addSubview(scrollView)
let column = NSTableColumn(identifier: "com.example.column", resizingMask: .autoresizingMask)
tableView.addTableColumn(column)
tableView.columnAutoresizingStyle = .uniformColumnAutoresizingStyle
tableView.headerView = nil
tableView.setAutomaticRowHeight(estimatedHeight: ItemView.defaultHeight)
tableView.intercellSpacing = CGSize(height: separatorHeight)
tableView.gridStyleMask = .solidHorizontalGridLineMask
}
override func setupHandlers() {
tableView.delegate = self
tableView.dataSource = self
}
override func setupLayout() {
LayoutConstraint.pin(to: .bounds, scrollView).activate()
}
override func setupDefaults() {
tableView.sizeLastColumnToFit()
}
}
extension WelcomeRecentDocumentsView {
class RowView: NSTableRowView {
let separatorHeight: CGFloat
let separatorColor: NSColor
init(separatorHeight: CGFloat = 1, separatorColor: NSColor = .gridColor) {
self.separatorHeight = separatorHeight
self.separatorColor = separatorColor
super.init(frame: .zero)
}
required init?(coder decoder: NSCoder) {
fatalError()
}
override func drawSelection(in dirtyRect: NSRect) {
let rect = bounds.insetBottom(by: -separatorHeight)
NSColor.alternateSelectedControlColor.setFill()
rect.fill()
}
override func drawSeparator(in dirtyRect: NSRect) {
let rect = bounds.insetTop(by: bounds.height - separatorHeight)
separatorColor.setFill()
rect.fill()
}
}
class ItemView: View {
static let defaultHeight: CGFloat = 52
override var intrinsicContentSize: NSSize {
return CGSize(intrinsicHeight: type(of: self).defaultHeight)
}
}
}

Resources