nordprojects / littleprinters-ios-app

A friendly new messaging app for Little Printer
https://nordprojects.co/projects/littleprinters
Apache License 2.0
27 stars 1 forks source link

Long printer name can overflow in printer list #16

Open Neelfyn opened 4 years ago

Neelfyn commented 4 years ago

Steps to reproduce

  1. Add a Little Printer with a longer name to the app, for example "Neelfyn's Little Printer" on an iOS device with a 4" screen.
  2. Go to the main screen with the list of Little Printers.

Expected result

The printer name is truncated with an ellipsis, or wraps to a new line.

Actual result

The printer name stacks with the key icon, and overflows outside of the box:

lp_title_overflow

This is a purely cosmetic issue, the usability of the key icon is not affected.

Configuration: iPod touch 7th generation, iOS 13.7, Little Printers 1.0.1.

joerick commented 4 years ago

Thanks for the report! Looks like a missing UI constraint in https://github.com/nordprojects/littleprinters-ios-app/blob/master/littleprinter/UI/Printers/PrinterListTableViewCell.swift#L135

Happy to review a PR if you're interested!

Neelfyn commented 4 years ago

@joerick Thanks for the tip! I'm not super familiar with Swift, but purely based on what the rest looks like, make.right.equalTo(shareButton.snp.left) appears to fix this for me. Not sure whether the margin for the key icon is handled elsewhere, but it looks fine to me without specifying a negative offset.

I suppose ownerLabel could also benefit from something like make.right.equalTo(cardImageView).offset(-6) while we're looking at this.

If this is an acceptable solution for you, I'll be happy to create a PR!

joerick commented 4 years ago

Sounds good to me!