这个“弹出”视图是如何创建的？

Question

Please see the image below.

How was this 'pop-up' view created? Suppose I wanted to completely imitate that view with the fonts, how would I do so?

Answer 1

There is not a SDK exposed component for this, but this could very easily be made using a hierarchy of views:

UIView - Main view. Uses a bezier path to create a protrusion to point from the source. Has a border and drop shadow added to its layer.

UIButton - Smaller font
UIButton - Larger font
UIButton - Change font type
UIButton - Container for sepia.
UILabel - "Sepia" text UISwitch - turning sepia on and off

Just show and hide the view with an animation. Also, create delegate callbacks to tell the delegate when events occur in the popover.

// Delegate returns if the text can get smaller to enable/disable the button
- (BOOL) didSelectSmallerFont:(CGFloat)fontSize;
// Delegate returns if the text can get larger to enable/disable the button
- (BOOL) didSelectLargerFont:(CGFloat)fontSize; 
- (void) didChangeFont:(UIFont*)font;
- (void) didToggleSepia:(BOOL)enabled;

etc.

Answer 2

The pyramid shape is not associated with the button that was clicked to present the popup. It would be a subview of the popup view, either a UIImageView or possibly drawn on a UIView, although a UIImageView would be the easier solution. You could definitely code the popup view to point that arrow at any point on the screen or in any direction. What I would do is instantiate the popup by means of an init method called initFromPoint: , then pass the center value of the button used to launch the popup. Then within the viewDidLoad method of the popup place the point appropriately based on the point.