Archive for the ‘ iOS ’ Category

UIBarButtonItem Image and Text

I want to add an image and text to a BarButtonItem but can’t in IB.

 

I looked into EdgeInsets but couldn’t get them to work with the image.

 

I’d also like to shrink the image

// https://stackoverflow.com/a/18853240/2895831
UIView *rightButtonView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 110, 50)];

UIImage *buttonImage = [UIImage imageNamed:@"LocationArrow"];
//UIEdgeInsets edgeInsets = UIEdgeInsetsMake(50, 50, 50, 50);
//UIImage *buttonImage = [[UIImage imageNamed:@"LocationArrow"] resizableImageWithCapInsets:edgeInsets];
//UIImage(CGImage: originalImage!.CGImage!, scale: 5, orientation: originalImage!.imageOrientation)
// https://stackoverflow.com/a/38523085/2895831
buttonImage = [UIImage imageWithCGImage:buttonImage.CGImage
 scale:4//CGImageGetHeight(buttonImage.CGImage)/2
 orientation:UIImageOrientationUp];

UIButton *rightButton = [UIButton buttonWithType:UIButtonTypeSystem];
rightButton.backgroundColor = [UIColor clearColor];
rightButton.frame = rightButtonView.frame;
[rightButton setImage:buttonImage forState:UIControlStateNormal];
[rightButton setTitle:NSLocalizedString(@"My Location", nil) forState:UIControlStateNormal];
rightButton.tintColor = [UIColor whiteColor];
rightButton.autoresizesSubviews = YES;
rightButton.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin;
rightButton.semanticContentAttribute = UISemanticContentAttributeForceRightToLeft;
[rightButton addTarget:self action:@selector(myLocationAction:) forControlEvents:UIControlEventTouchUpInside];

CGFloat padding = 10.0f;
[rightButton setTitleEdgeInsets:UIEdgeInsetsMake(0, 0, 0, padding)];
//[rightButton setContentEdgeInsets:UIEdgeInsetsMake(0, 0, 0, padding)];
//[rightButton setContentEdgeInsets:UIEdgeInsetsMake(padding, padding, padding, padding)];
//[rightButton setImageEdgeInsets:UIEdgeInsetsMake(padding, 0, padding, 0)]; //0, padding, 0, padding
//[rightButton setImageEdgeInsets:UIEdgeInsetsMake(padding, padding, padding, padding)];

[rightButtonView addSubview:rightButton];

UIBarButtonItem *rightBarButton = [[UIBarButtonItem alloc] initWithCustomView:rightButtonView];
self.navigationItem.rightBarButtonItem = rightBarButton;

 

Image

[UIImage imageWithCGImage:buttonImage.CGImage scale:4 orientation:UIImageOrientationUp];

Pick your method to scale

CGImageGetHeight(buttonImage.CGImage)/2

Or

CGImageGetWidth(...)/DESIREDWIDTH

 

IB

There is the handy

Bar Item

Image Inset

 

Advertisements

UIButton VerticalLayout

https://stackoverflow.com/a/22621613/2895831

I added some buttons into a UIStackView but the image overlaps the button.

I modified the contentEdgeInsets

CGFloat inset = (self.frame.size.height - totalHeight)/2;
self.contentEdgeInsets = UIEdgeInsetsMake(inset, 0.0f, inset, 0.0f);

 

 

Pollen Today Widget

I want a today Widget to show pollen count.

I downloaded:

Clarityn’s Pollen Forecast UK by Bayer HealthCare AG

https://appsto.re/gb/tPFfw.i

They have a website

http://www.claritynallergy.co.uk/allergyforecast/?zip=X

It doesn’t have the Widget I wanted so I started looking for an API.


POST http://www.claritynallergy.co.uk/webservice/allergyforecast.php

Header

Accept: application/json

Body

Form URL-Encoded

zip=NE11EE

Response

"{\"Durham & Newcastle\":{\"1499515201\":{\"precipitation\":8,\"maxTemp\":21,\"minTemp\":16,\"pollenLevel\":\"H\",\"humidity\":83,\"windSpeed\":7,\"weatherCode\":7,\"uvIndex\":5,\"pollenType\":\"Grass\"},\"1499601600\":{\"precipitation\":18,\"maxTemp\":18,\"minTemp\":15,\"pollenLevel\":\"H\",\"humidity\":80,\"windSpeed\":18,\"weatherCode\":7,\"uvIndex\":4,\"pollenType\":\"Grass\"},\"1499688000\":{\"precipitation\":23,\"maxTemp\":18,\"minTemp\":14,\"pollenLevel\":\"M\",\"humidity\":69,\"windSpeed\":11,\"weatherCode\":3,\"uvIndex\":7,\"pollenType\":\"Grass\"}}}"

Images

http://www.claritynallergy.co.uk/static/media/images/claritynallergy/7-trans.png” : 


I found Benadryl has one.

https://www.benadryl.co.uk/social-pollen-count


GET https://socialpollencount.co.uk/api/forecast?location=%5BLAT,LON]

Response

{"status_code":"200 OK","date":"2017-07-02T07:13:47+00:00","forecast":[{"date":"2017-06-29T08:00:01+00:00","pollen_count":"Low"},{"date":"2017-06-30T08:00:01+00:00","pollen_count":"Low"},{"date":"2017-07-01T08:00:01+00:00","pollen_count":"High"},{"date":"2017-07-02T08:00:01+00:00","pollen_count":"High","temperature":"18","weather_code":"01","weather":"Sunny"},{"date":"2017-07-03T08:00:01+00:00","pollen_count":"High","temperature":"18","weather_code":"07","weather":"Medium-level cloud"},{"date":"2017-07-04T08:00:01+00:00","pollen_count":"Moderate","temperature":"14","weather_code":"12","weather":"Light rain"}]}

Images

https://socialpollencount.co.uk/images/content/weather/07.pnp” :


App: https://itunes.apple.com/gb/app/benadryl-social-pollen-count/id638068252?mt=8

App doesn’t exist.


Progress
I’ve started building my own

img_4314 img_4315-1 img_4317-1
The Widget needs a lot of work but the basis is there, I’ve built a framework that gets all the data. Now to finish the UI…

Carousel View

iCarousel

I wanted to add an animation when dismissing, a button at the top and bottom of the view, one to dismiss, one to save, and move off in that direction.

MDCSwipeToChoose

TinderSimpleSwipeCards

@clsource added other directions

Directions

Jam Jar Cinema Wallet Passes

My local cinema is Awesome!

I want to create passes to keep a memento of the films I’ve seen. I order online so don’t get ticket stubs from the venue and I like having a digital copy, like CineWorld does.

 

There are a number of websites which allow you to make Wallet Passes.

I’ve recently tried PassSlot (https://www.passslot.com).

PassSlot

It has a free tier which allows you to create 1 PassID, multiple templates, and a set limit of passes, which is all I need.

It has an SDK which is great.

I created my Template with variables for the various pieces of information and now I have an iOS app which allows me to fill in the values, pick an image and create a pass.

It uses the iTunes Artwork Finder from Ben Dodson.

Wallet


The PassSlot API is available on ‘mashape’

The documentation mentions

Other Platforms – The PassSlot API is also available through mashape. They have client libraries for Node, Ruby, Java, .NET, Windows 8

On the marketplace

https://market.mashape.com/passslot/passbook

There is a button for open in Paw. I can’t get it to work at the moment.


I’d started making a Mac app to create Wallet Passes.

I followed the RW tutorials on PassKit but my PHP was rusty so never got that side working.

I got the local one working which used the sign tool and created all the files

  • pass.json
  • manifest.json
  • .pkpass
  • etc

JJC Passes (Mac) (1)

But when I tried to add them to my phone I ran into issues, I raised a bug will Apple and they are working on something.

The pass has to be served over SSL.

I made my own Contact Card: https://alexhedley.wordpress.com/2014/12/29/passbook/

Custom UIAlertController in Objc

 

Custom UIAlertController in Objc

 

You can change the background colour of the Alert too.

Change the colour of added controls like UITextField too!

Links

Hacking UIAlertController in Swift.
https://iosdevcenters.blogspot.com/2016/05/hacking-uialertcontroller-in-swift.html

UIAlertController custom font, size, color
http://stackoverflow.com/a/26530577/2895831

XLForm

XLForm is the most flexible and powerful iOS library to create dynamic table-view forms. The goal of the library is to get the same power of hand-made forms but spending 1/10 of the time.

Image

Add an image to the left of a form input

row = [XLFormRowDescriptor formRowDescriptorWithTag:@"fullname" rowType:XLFormRowDescriptorTypeText];
[row.cellConfigAtConfigure setObject:@"Full Name" forKey:@"textField.placeholder"];
[row.cellConfigAtConfigure setObject:[UIImage imageNamed:@"User"] forKey:@"imageView.image"];
[section addFormRow:row];

Buttons

XLFormRowDescriptor *buttonRow = [XLFormRowDescriptor formRowDescriptorWithTag:kButton rowType:XLFormRowDescriptorTypeButton title:@"A 6 digit verification code has been sent via SMS"];
[buttonRow.cellConfig setObject:[UIColor purpleColor] forKey:@"textLabel.color"];
[buttonRow.cellConfig setObject:[UIFont fontWithName:kFont size:10] forKey:@"textLabel.font"];
buttonRow.cellStyle = UITableViewCellStyleValue1;
buttonRow.value = @"Enter Code";
buttonRow.action.formSelector = @selector(didTouchButton:);
[section addFormRow:buttonRow];

Screenshot

Register


Switch

To turn the switch on

row = [XLFormRowDescriptor formRowDescriptorWithTag:@"switch" rowType:XLFormRowDescriptorTypeBooleanSwitch title:@"Boolean"];
row.value = @1;

Issues

I raised an issue about the Floating Label covering the Image.

Register - JVFloatLabeledTextField (2)

A very quick reply to update

- (NSArray *)layoutConstraints

I added the following:

const static CGFloat kHMargin = 50.0f;
NSDictionary *metrics = @{@"vMargin":@(kVMargin), @"hMargin":@(kHMargin)};
[result addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-(hMargin)-[floatLabeledTextField]-|" options:0 metrics:metrics views:views]];

Register - JVFloatLabeledTextField (4)


Cell Separator

Add in ‘viewDidLoad’

self.tableView.separatorColor = [UIColor redColor];

Register - JVFloatLabeledTextField (5)


Section Background Colour

I wished to change the Header/Footer background colour.

Code

- (void)viewDidLoad {
    [[self tableView] registerClass:[UITableViewHeaderFooterView class] forHeaderFooterViewReuseIdentifier:@"headerFooterReuseIdentifier"];
}

Header

-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
    UITableViewHeaderFooterView *headerFooterView = [[self tableView] dequeueReusableHeaderFooterViewWithIdentifier:@"headerFooterReuseIdentifier"];
    headerFooterView.contentView.backgroundColor = kBackgroundColor;

    return headerFooterView;
}

Footer

-(UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section {
    UITableViewHeaderFooterView *headerFooterView = [[self tableView] dequeueReusableHeaderFooterViewWithIdentifier:@"headerFooterReuseIdentifier"];
    headerFooterView.contentView.backgroundColor = kBackgroundColor;

    return headerFooterView;
}

FloatLabeledTextFieldCell

Floating Label

There is a property on the TextField you can set to change the colour of the Floating Label

  • floatingLabelActiveTextColor
[row.cellConfig setObject:[UIColor redColor] forKey:@"floatLabeledTextField.floatingLabelActiveTextColor"];

TextField

If you want to change the TextField text colour:

[row.cellConfig setObject:[UIColor whiteColor] forKey:@"floatLabeledTextField.textColor"];

Register - JVFloatLabeledTextField (5)

Didn’t change anything:

[row.cellConfig setObject:[UIColor greenColor] forKey:@"textLabel.highlightedTextColor"];

Or

[row.cellConfig setObject:[UIColor redColor] forKey:@"floatLabeledTextField.floatingLabel.textColor"];

Image

Set the “imageView.tintColor”

[row.cellConfigAtConfigure setObject:[UIColor whiteColor] forKey:@"imageView.tintColor"];

Register - JVFloatLabeledTextField (6)


Accessory

- (UIView *)inputAccessoryViewForRowDescriptor:(XLFormRowDescriptor *)rowDescriptor
{
      return nil; //will hide it completely
      // You can use the rowDescriptor parameter to hide/customize the accessory view for a particular rowDescriptor type.
}

 

Without reading the documentation!!

Adding a Checkmark

XLFormRowDescriptor *row = [XLFormRowDescriptor formRowDescriptorWithTag:@"Check" rowType:XLFormRowDescriptorTypeBooleanCheck title:NSLocalizedString(@"Check", nil)];
[newSection addFormRow:row];

Swap to a different image

UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Circle"]];
imageView.tintColor = [UIColor redColor];
[row.cellConfig setObject:imageView forKey:@"accessoryView"];

Now to handle the toggling…

This method isn’t being called.

- (void)tableView:(UITableView *)tableView accessoryButtonTappedForRowWithIndexPath:(NSIndexPath *)indexPath {
    NSLog(@"Tapped");
}

 


Dynamically Adding Rows

I’m using segues to move between views.

I’m setting a property – an array of items in the ‘prepareForSegue’.

But ‘initWithCoder’ doesn’t have these values set yet.

‘viewDidLoad’ does so call a method there.

Create your Form, Section(s) and Row(s) in the interface and use them:

[section addFormRow:row beforeRow:buttonRow];

Selected Row Label colour

Tried a couple of options:

[row.cellConfig setObject:[UIColor redColor] forKey:@"textLabel.highlightedTextColor"];

And

[row.cellConfig setObject:[UIColor redColor] forKey:@"textLabel.tintColor"];

 


Change the cursor colour

  • textField.tintColor
[row.cellConfig setObject:[UIColor greenColor] forKey:@"textField.tintColor"];

Register - JVFloatLabeledTextField (7)

 


 


Alternatives