Macらしいアプリケーションを実現するために / To Make Mac-like App

流行りのダークモードから、古参のサービスメニューやAppleScript、大分馴染んできた通知センターや共有ボタン…こういったmacOSの各種機能に積極的に対応することが、アプリの「Macらしさ」に繋がります。５ちゃんねるブラウザ「BathyScaphe」での実装例をご紹介します。macOS native #02 (https://macos-native.github.io) での発表資料です。

Transcript

1. NBD04
   OBUJWF
   
   ൃදࢿྉ MacΒ͍͠ΞϓϦέʔγϣϯΛ ࣮ݱ͢ΔͨΊʹ Š#BUIZ4DBQIFͰͷࣄྫ͔Š 2018೥12݄22೔
   tsawada2 BathyScaphe ϓϩδΣΫτ؅ཧऀ PDF Edition
2. © 2018 tsawada2 macOS native ͜Μʹͪ͸ !2 tsawada2 झຯͰ.BDΞϓϦΛ։ൃ͍ͯ͠·͢
   ʢ̑ͪΌΜͶΔؔ࿈͹͔Γʜʣ
3. © 2018 tsawada2 macOS native 4PSSZ
   UIJT
   TFTTJPO
   JT
   0CKFDUJWF$
   POMZ w 4XJGUͷ࣌୅ʹਃ͠༁͋Γ·ͤΜ
   w Ͱ΋ɺ͖ͬͱΠϝʔδ͸఻ΘΔ͸ͣ !3
4. © 2018 tsawada2 macOS native #BUIZ4DBQIFʹ͍ͭͯ !4
5. © 2018 tsawada2 macOS native #BUIZ4DBQIF !5
6. © 2018 tsawada2 macOS native #BUIZ4DBQIF w ೥͔Β։ൃ
   w ݩʑผͷϒϥ΢β͔Β೿ੜ
   w ݱࡏɺNBD04ઐ༻ͷϒϥ΢βͱͯ͠͸͓ͦΒ͘། Ұͷݱ໾બख !6
7. © 2018 tsawada2 macOS native ̑ͪΌΜͶΔͱ͸ w چ໊শʮ̎ͪΌΜͶΔʯ
   w ڊେܝࣔ൘ʜ࠷ۙ͸஌Βͳ͍ਓ΋ଟ͍ͷͩΖ͏͔ʁ !7 https://www.5ch.net/
8. © 2018 tsawada2 macOS native ̑ͪΌΜͶΔϒϥ΢βͱ͸ w ಈػɿ8FCϒϥ΢βΑΓ΋ޮ཰తʹɺڧྗʹӾཡ ͍ͨ͠ʢ༷ʑͳศརػೳɺϩάͷ஝ੵFUDʣ
   w ͔ͭͯ͸֤ϓϥοτϑΥʔϜ্ʹ༷ʑͳઐ༻ϒϥ΢ β͕ଘࡏ
   w ݱࡏ͸ॾࣄ৘ʹΑΓɺ͔ͳΓݮগ !8
9. © 2018 tsawada2 macOS native ̑ͪΌΜͶΔϒϥ΢βͬͯେม ٻΊΒΕΔཁૉٕज़
   w ωοτϫʔΫ
   w ςΩετॲཧ
   w ը૾ॲཧ
   w σʔλͷ؅ཧ !9
10. © 2018 tsawada2 macOS native #BUIZ4DBQIF
    8FCαΠτΑΓ !10 https://bathyscaphe.bitbucket.io
11. © 2018 tsawada2 macOS native େݪଇ ̑ͪΌΜͶΔϒϥ΢βͰ͋ΔલʹɺmacOSΞϓϦ έʔγϣϯͰ͋Δ
    ˣ
    NBD04ͷྲّྀɺ͓࡞๏ʹै͏ʹ)*(४ڌ Designing Desktop Interactions macOS native #01 !11
12. © 2018 tsawada2 macOS native ౰ͨΓલͷ͜ͱͰ͕͢ w NBD04͕ͲΕ΄ͲັྗతͳςΫϊϩδʔΛඋ͑ͯ ΋ɺͦͷ্Ͱಈ࡞͢ΔΞϓϦέʔγϣϯ͕ରԠͯ͠ ͍ͳ͚Ε͹ͦΕΛ࣮ײ͢Δ͜ͱ͸Ͱ͖·ͤΜɻ
    w .BDΛ࢖͍ͬͯͯྑ͔ͬͨɺͱ̑ͪΌΜͶΔΛϒ ϥ΢ζ͠ͳ͕Βײͯ͡΋Β͑ΔΑ͏ʹ͢Δʂ !12
13. © 2018 tsawada2 macOS native NBD04ͷ৽ػೳΛऔΓೖΕΔϝϦοτ w ։ൃऀɿ࡞ָ͍͍ͬͯͯ͠ɺϫΫϫΫ͢Δ
    w Ϣʔβɿ৽͍͠04ʹͯ͠Α͔ͬͨͱ࣮ײͰ͖Δ
    w Ϣʔβɿ৽͍͠04ʹΞοϓσʔτͨ͘͠ͳΔ
    w ৽͍͠04ͷγΣΞ͕֦େ͢Δ
    w ։ൃऀɿݹ͍04Λಈ࡞ର৅͔Β֎ͤΔ
    w ։ൃऀɿ։ൃָ͕ʹͳΔɺָ͘͠ͳΔ !13
14. © 2018 tsawada2 macOS native ࠓճऔΓ্͛ΔNBD04ͷػೳ !14 macOS 10.14 10.8 OS X Mac OS X 10.0 ׽ࣈTalk 7 (7.1.1) (AppleScript) αʔϏε ௨஌ηϯλʔ ڞ༗ϝχϡʔ μʔΫϞʔυ
15. © 2018 tsawada2 macOS native μʔΫϞʔυ !15
16. © 2018 tsawada2 macOS native μʔΫϞʔυ΁ͷରԠ w جຊతʹ͸ɺࣗಈతʹରԠ͞ΕΔ͸ͣɺͩͬͨ Supporting Dark Mode in Your Interface Developer Documentation !16
17. © 2018 tsawada2 macOS native ਺೥དྷɺ४උ͖͔ͯͨ͠Βʜ !17 /47JTVBM&⒎FDU7JFXͷ ׆༻ 5FNQMBUF
    *NBHFTͷ ׆༻ ඪ४෦඼ʹΑΔαΠυόʔ
18. © 2018 tsawada2 macOS native Ͱ΋ɺ͜ΜͳՕॴɺ͋Γ·ͤΜ͔ʁ w ʮനΛࢦఆͯ͠ృͬͨʯഎܠͷՕॴ
    w ʮγεςϜΧϥʔʹແ͍৭ΛృͬͨʯՕॴ !18 ਖ਼௚ɺ๨Εͯ·ͨ͠
19. © 2018 tsawada2 macOS native ࣄྫ
    ന͍എܠ !19
20. © 2018 tsawada2 macOS native ࣄྫ
    ന͍എܠ !20 ςΩετ͸μʔΫϞʔυʹ ߹Θͤͯࣗಈతʹ৭͕มԽ ͕ͨ͠ɺഎܠ৭͕നͷ··
21. © 2018 tsawada2 macOS native ࣄྫ
    ന͍എܠ !21
22. © 2018 tsawada2 macOS native ࣄྫ
    ന͍എܠ !22 ςΩετ͸μʔΫϞʔυʹ ߹Θͤͯࣗಈతʹ৭͕มԽ ͕ͨ͠ɺഎܠ৭͕നͷ··
23. © 2018 tsawada2 macOS native ࣄྫ
    
    ݪҼͱରॲ๏ w ৭ΛʮനʯͰృ͍ͬͯΔ͔Βʂ
    ˣ
    w ৭ࢦఆͷݟ௚͠ʢγεςϜΧϥʔ΁ʣ
    w ·ͨ͸ɺݱࡏͷ֎؍ϞʔυΛݟͯృΔ৭Λ੾Γସ͑ !23
24. © 2018 tsawada2 macOS native ࣄྫ
    ରॲ !24 എܠ৭ΛʮനʯͰ͸ͳ͘ɺద੾ͳγεςϜΧϥʔʹࢦఆ͢Δ
25. © 2018 tsawada2 macOS native ࣄྫ
    ରॲ !25 // 手っ取り早く背景を白にする self.baseView.wantsLayer = YES; CGColorRef white = CGColorCreateGenericGray(1.0f, 1.0f); CGColorRef white = [[NSColor controlBackgroundColor] CGColor]; self.baseView.layer.backgroundColor = white; CGColorRelease(white); എܠ৭ΛʮനʯͰ͸ͳ͘ɺద੾ͳγεςϜΧϥʔͰඳը͢Δ
26. © 2018 tsawada2 macOS native ࣄྫ
    ղܾޙ !26
27. © 2018 tsawada2 macOS native ࣄྫ
    ղܾޙ !27
28. © 2018 tsawada2 macOS native ࣄྫ
    ಠࣗௐ߹৭ͷରԠ w γεςϜΧϥʔʹ͸ແ͍͚Ͳɺ04ඪ४ΞϓϦͰݟ ͔͚Δ৭Λਅࣅ͍ͯ͠ΔՕॴɺ͋Γ·ͤΜ͔ʁ !28
29. © 2018 tsawada2 macOS native ࣄྫ !29 ςΩετ͸μʔΫϞʔυʹ߹ Θͤͯࣗಈతʹ৭͕มԽ͠ ͕ͨɺഎܠ৭͕Ϛονͯ͠ ͍ͳ͍ͨΊݟͮΒ͍
30. © 2018 tsawada2 macOS native ࣄྫ
    ରॲ w μʔΫϞʔυ༻ͷ৭Λผʹબఆ
    w "TTFU
    $BUBMPH
    ʹͦΕͧΕͷ৭Λొ࿥ !30
31. © 2018 tsawada2 macOS native $PMPS
    4FU
    Λ࡞੒ !31
32. © 2018 tsawada2 macOS native ࡞੒ͨ͠$PMPS
    4FUΛݺͼग़͢ !32 - (NSColor *)infoBackgroundColor { if (@available(macOS 10.13, *)) { return [NSColor colorNamed:@"ThreadTitleBarInfoBg"]; } else { return [NSColor colorWithCalibratedHue:(48/360.0f) saturation:0.19f brightness:1.0f alpha:1.0f]; } }
33. © 2018 tsawada2 macOS native ࣄྫ
    ղܾޙ !33
34. © 2018 tsawada2 macOS native εΫϩʔϧόʔͱμʔΫϞʔυ !34
35. © 2018 tsawada2 macOS native εΫϩʔϥʔͷ໌Δ͞ NSScroller class reference Developer Documentation !35 typedef NS_ENUM(NSInteger, NSScrollerKnobStyle) { NSScrollerKnobStyleDefault = 0, // dark with light border; good against any background NSScrollerKnobStyleDark = 1, // dark; good against a light background NSScrollerKnobStyleLight = 2 // light; good against a dark background } NS_ENUM_AVAILABLE_MAC(10_7); Default Dark Light
36. © 2018 tsawada2 macOS native ࣄྫ
    ࠷ద੾Γସ͕͑ٲʹ w εΫϩʔϧϏϡʔͷഎܠ৭ʹ߹ΘͤͯεΫϩʔϥʔ ͷ໌Δ͞Λ੾Γସ͑ΔॲཧΛೖΕ͍ͯͨ !36 ໌Δ͍എܠͷ࣌͸…Default ҉͍എܠͷ࣌͸…Light
37. © 2018 tsawada2 macOS native ࣄྫ
    ࠷ద੾Γସ͕͑ٲʹ w μʔΫϞʔυͰ͸ɺNSScrollerKnobStyleDefault
    ৭͕നͬΆ͘ͳΔˠݟͮΒ͘ͳͬͯ͠·ͬͨ !37 Default͕നͬΆ͘ͳΔ Light͸͋·ΓมԽͳ͠ എܠ৭͸Ϣʔβ͕ࢦఆ ͢Δʹ04ͷ֎؍Ϟʔυ ͱ͸ඇಉظʂ
38. © 2018 tsawada2 macOS native ࣄྫ
    ରॲ w ֎؍ϞʔυʹΑͬͯɺॲཧΛ੾Γସ͑ !38 CGFloat brightness = backgroundColor.brightnessComponent; if (ダークモードなら) { return (brightness < 0.5) ? NSScrollerKnobStyleDefault : NSScrollerKnobStyleDark; } else { // ライトモードなら return (brightness < 0.5) ? NSScrollerKnobStyleLight : NSScrollerKnobStyleDefault; }
39. © 2018 tsawada2 macOS native ݱࡏͷ֎؍ϞʔυΛ൑ผ͢Δίʔυ !39 NSAppearance *appearance = someView.effectiveAppearance; // or, someWindow… if (@available(macOS 10.14, *)) { NSAppearanceName bestMatchAppearanceName = [appearance bestMatchFromAppearancesWithNames: @[NSAppearanceNameAqua, NSAppearanceNameDarkAqua]]; if ([bestMatchAppearanceName isEqualToString:NSAppearanceNameDarkAqua]) { // ダークモード } else { // ライトモード } } else { // 10.13以前。常にライトモード }
40. © 2018 tsawada2 macOS native ࣄྫ
    ରॲޙ !40 w μʔΫϞʔυʴ໌Δ͍എܠ৭ͷ࣌Ͱ΋ɺεΫϩʔϥʔ ͕ݟ΍͘͢ͳͬͨ ໌Δ͍എܠͷ࣌͸…Dark ҉͍എܠͷ࣌͸…Default
41. © 2018 tsawada2 macOS native μʔΫϞʔυ
    ·ͱΊ w ීஈ͔Βඪ४ͷ෦඼ɺγεςϜͷΧϥʔΛ࢖͍ͬͯ Ε͹͸ͦͷ··͍͚Δ
    w ͨͩ͠ɺࡉ͔͍ͱ͜ΖͰ΍͸ΓͲ͏ͯ͠΋ߟྀ࿙Ε ͯ͠ΔՄೳੑ͸͋ΔͱݟΔ΂͖
    w ௚͢͜ͱ͸ͦΕ΄ͲखؒͰ͸ͳ͍ɻݟ͚ͭ࣍ୈɺ௚ ͠·͠ΐ͏ !41
42. © 2018 tsawada2 macOS native ௨஌ηϯλʔ !42
43. © 2018 tsawada2 macOS native ௨஌ηϯλʔʢͷόφʔʣ Notifications Human Interface Guidelines !43
44. © 2018 tsawada2 macOS native ௨஌ͷ஫ҙ఺ w σϑΥϧτͰ͸ɺ௨஌Λൃߦͨ͠ΞϓϦࣗ਎͕ΞΫ ςΟϒͳ৔߹͸௨஌όφʔ͕දࣔ͞Εͳ͍
    ˠͦΕ͕ࠔΔ৔߹΋͋Δ !44
45. © 2018 tsawada2 macOS native ରࡦίʔυ NSUserNotificationCenterDelegate Protocol Developer Documentation !45 // どこかでデリゲートを設定しておく [[NSUserNotificationCenter defaultUserNotificationCenter] setDelegate: (CMRAppDelegate *)[NSApp delegate]]; @implementation CMRAppDelegate(NSUserNotificationCenterDelegateImpl) // このデリゲートメソッドで常にYESを返すようにする - (BOOL)userNotificationCenter:(NSUserNotificationCenter *)center shouldPresentNotification:(NSUserNotification *)notification { return YES; } @end
46. © 2018 tsawada2 macOS native ௨஌ͰԻΛ໐Β͢ʹ͸ʁ NSUserNotification class reference Developer Documentation !46 NSUserNotification *userNotification = [[NSUserNotification alloc] init]; userNotification.title = @“Hogeeeeee!!!”; userNotification.informativeText = @“User Notification Test”; userNotification.hasActionButton = NO; userNotification.soundName = NSUserNotificationDefaultSoundName; ʻϙϩϦϯ
47. © 2018 tsawada2 macOS native ڞ༗ϝχϡʔʢڞ༗Ϙλϯʣ !47
48. © 2018 tsawada2 macOS native ڞ༗Ϙλϯ !48
49. © 2018 tsawada2 macOS native ڞ༗Ϙλϯ w Ϙλϯܕͷπʔϧόʔ߲໨Λ ༻ҙ͢Δ
    w Ϛ΢εϘλϯΛԡ͢ͱɺϝ χϡʔ͕දࣔ͞ΕΔΑ͏ʹ࣮ ૷͢Δ
    ˠʮ཭͢ͱʯͰ͸͋Γ·ͤΜ πʔϧόʔΞΠίϯͱͦͷ࣮૷ macOS native #01 !49 /44IBSF5FNQMBUF
50. © 2018 tsawada2 macOS native ڞ༗Ϙλϯ w ίϯιʔϧʹܯࠂ͕ग़Δ΄Ͳେ੾ͳ͜ͱ
    w ίϯιʔϧʹઃఆํ๏·Ͱॻ͔Ε͍ͯΔ Warning: -[NSSharingServicePicker showRelativeToRect: ofView: preferredEdge:] should not be called on mouseUp Please configure the sender with -[NSControl sendActionOn:NSLeftMouseDownMask]; !50 ʮ཭͢ͱʯͰ͸͋Γ·ͤΜ
51. © 2018 tsawada2 macOS native ڞ༗ϘλϯͷηοτΞοϓ w ݴΘΕͨ௨Γʹ࣮૷͠·͠ΐ͏
    ˠͨͩ͠ίʔυهड़͕ඞཁʢ*#͔Βग़དྷͳ͍ʁʣ !51 @property (nonatomic) IBOutlet NSButton *shareToolbarButtonItem; // どこかで最初にやっておく！（例えば -awakeFromNib とかでも…） [shareToolbarButtonItem sendActionOn:NSLeftMouseDownMask];
52. © 2018 tsawada2 macOS native ڞ༗ϘλϯͷηοτΞοϓ !52 // 共有ボタンに以下のようなIBActionをセット - (IBAction)share:(id)sender { if (![sender respondsToSelector:@selector(bounds)]) { return; // 「テキストのみ」ツールバー対策（手抜き） } NSArray *items = …; // 共有したいデータを用意 NSSharingServicePicker *picker; picker = [[NSSharingServicePicker alloc] initWithItems:items]; picker.delegate = …; [picker showRelativeToRect:[sender bounds] ofView:sender preferredEdge:NSMinYEdge]; }
53. © 2018 tsawada2 macOS native ΞχϝʔγϣϯޮՌʹ͍ͭͯ w ͍͔ͭ͘ɺσϦήʔτϝιουΛ࣮૷͢Δඞཁ͋Γ
    w ڞ༗͢Δσʔλ͕/463-͡Όͳ͍ͱμϝΈ͍ͨ !53
54. © 2018 tsawada2 macOS native ΞχϝʔγϣϯޮՌͷ࣮૷ྫ NSSharingServiceDelegate Protocol Developer Documentation !54 - (NSRect) sharingService:(id)sharingService sourceFrameOnScreenForShareItem:(id<NSPasteboardWriting>)item { NSRect imageViewBounds = self.imageView.bounds; return [self.window convertRectToScreen:imageViewBounds]; } - (NSImage *)sharingService:(id)sharingService transitionImageForShareItem:(id<NSPasteboardWriting>)item contentRect:(NSRect *)contentRect { return self.imageView.image; } - (NSWindow *)sharingService:(NSSharingService *)sharingService sourceWindowForShareItems:(NSArray *)items sharingContentScope:(NSSharingContentScope *)sharingContentScope { *sharingContentScope = NSSharingContentScopeFull; return self.window; }
55. © 2018 tsawada2 macOS native ϨδΣϯυʢαʔϏεɺ"QQMF4DSJQUʣ !55
56. © 2018 tsawada2 macOS native αʔϏεʢαʔϏεϝχϡʔʣ !56
57. © 2018 tsawada2 macOS native αʔϏε w .BD
    04
    9
    ʢͱ͍͏͔ɺ/FYU45&1ͷࠒʣ͔Β͋Δ
    w ஍ຯͳͷʹແ͘ͳΒͳ͍
    w ίϯςΩετϝχϡʔ͔Β΋࢖͑ͨΓɺ݁ߏศར
    w ͜͏͍͏஍ຯ͚ͩͲૉఢͳػೳͬͯɺਪͨ͘͠ͳΓ·͢ Services Implementation Guide Documentation Archive !57 Services Human Interface Guidelines
58. © 2018 tsawada2 macOS native αʔϏεʹରԠ͢Δ w αʔϏεΛڗड͢Δ
    w αʔϏεΛఏڙ͢Δ !58
59. © 2018 tsawada2 macOS native #BUIZ4DBQIFͷαʔϏεαϙʔτ w ςʔϒϧϏϡʔͷ߲໨ʹରͯ͠΋αʔϏε͕࢖͑Δ ͷ͕ɺͪΐͬͱࣗຫ !59
60. © 2018 tsawada2 macOS native #BUIZ4DBQIFͷαʔϏεαϙʔτ w #BUIZ4DBQIF΋ɺαʔϏεΛఏڙ͍ͯ͠·͢ !60
61. © 2018 tsawada2 macOS native "QQMF4DSJQU w ͪ͜Β͸ͳΜͱɺप೥Λܴ͑ͨػೳ
    w ͜Ε·ͨɺ஍ຯͳͷʹແ͘ͳΒͳ͍
    w ͣͬͱੲ͔Β৮Ε߹͖ͬͯͨػೳ͔ͩΒɺਪͨ͘͠ ͳΓ·͢ʂ
    w ਪ͠ΛߦಈͰࣔ͢ʹࣗ࡞ΞϓϦͰରԠ͢Δʂ !61
62. © 2018 tsawada2 macOS native ΞϓϦέʔγϣϯͷ"QQMF4DSJQUରԠϨϕϧ w 4DSJQUBCMF
    w "UUBDIBCMF
    w 3FDPSEBCMF !62 ׽ࣈ5BMLͷࠒɺΑ͘ҎԼͷͭͷ୯ޠͰઆ໌͞Ε͍ͯͨ ͜Ε͸νϣοτେม͔΋
63. © 2018 tsawada2 macOS native 4DSJQUBCMF
    "QQMJDBUJPO
    ʹͳΔʹ͸ w ༻ޠࣙॻΛॻ͘ɺ͜Εʹਚ͖Δ
    w ग़དྷΔ͚ͩ։ൃͷॳظஈ֊͔Βߟྀ͓ͯ͘͠
    w ͓͢͢ΊɿӅ͠ઃఆ΁ͷΞΫηεखஈͱͯ͠׆༻ AppleScript Λαϙʔτ͢Δ macOS native #03 ʹظ଴ !63
64. © 2018 tsawada2 macOS native "UUBDIBCMF
    "QQMJDBUJPO
    ʹͳΔʹ͸ w εΫϦϓτͷ࣮ߦ͸ɺઐ༻Ϋϥε͕͋ΔͷͰ؆୯
    w ͓͢͢ΊɿεΫϦϓτϝχϡʔΛ͚ͭͯΈ·ͤΜ͔
    w 4DSJQUBCMFͳͱ͖ɺ"UUBDIBCMF͕׆͖ͯ͘Δ NSUserAppleScriptTask class reference Developer Documentation !64
65. © 2018 tsawada2 macOS native #BUIZ4DBQIFͷ"QQMF4DSJQUαϙʔτ !65 Scriptable
66. © 2018 tsawada2 macOS native #BUIZ4DBQIFͷ"QQMF4DSJQUαϙʔτ !66 Attachable
67. © 2018 tsawada2 macOS native ͓·͚ɿ͋ͷԻΛ໐Β͢ͷ͸Ͳͳͨ !67
68. © 2018 tsawada2 macOS native ͍ͭͰ΋޷͖ͳ࣌ʹʮ͋ͷԻʯΛ໐Βͦ͏ System Sound Services Developer Documentation !68 @import AudioToolbox; AudioServicesPlaySystemSound(22); // Disc Burned AudioServicesPlaySystemSound(16); // Trash! AudioServicesPlaySystemSound(1); // Move etc. AudioServicesPlaySystemSound(15); // Boom!
69. https://macos-native.github.io