iOS仿微信聊天页面长按气泡弹窗

iOS仿微信聊天页面长按气泡弹窗

在 iOS 开发中，实现一个类似微信聊天页面的长按气泡弹窗功能是非常有趣且实用的一个需求。在本文中，我们将详细描述如何实现这个功能。

效果图

首先，让我们看一下效果图：

![效果图]( 用法

实现这个功能非常简单，只需要几个步骤：

1. 将 `JYBubbleButtonModel`、`JYBubbleMenuView` 和 `JYTextView` 这三个类添加到您的工程中。

2. 将原来显示聊天内容的 `textView` 继承 `JYTextView` 即可。

代码

JYBubbleButtonModel.h

```objcimport

@interface JYBubbleButtonModel : NSObject@property (nonatomic, copy) NSString *text;

@property (nonatomic, assign) CGFloat width;

@end```

JYBubbleButtonModel.m

```objcimport "JYBubbleButtonModel.h"

@implementation JYBubbleButtonModel- (instancetype)initWithText:(NSString *)text {

self = [super init];

if (self) {

_text = text;

_width =100; // 默认宽度为100 }

return self;

}

@end```

JYTextView.h

```objcimport

@interface JYTextView : UITextView@property (nonatomic, copy) NSArray *bubbleModels;

@end```

JYTextView.m

```objcimport "JYTextView.h"

@implementation JYTextView- (instancetype)initWithFrame:(CGRect)frame {

self = [super initWithFrame:frame];

if (self) {

_bubbleModels = @[].mutableCopy;

}

return self;

}

@end```

JYBubbleMenuView.h

```objcimport

@interface JYBubbleMenuView : UIView@property (nonatomic, copy) NSArray *menuItems;

- (void)showMenuInView:(UIView *)view;

@end```

JYBubbleMenuView.m

```objcimport "JYBubbleMenuView.h"

@implementation JYBubbleMenuView- (instancetype)initWithFrame:(CGRect)frame {

self = [super initWithFrame:frame];

if (self) {

_menuItems = @[].mutableCopy;

}

return self;

}

- (void)showMenuInView:(UIView *)view {

// 在这里实现菜单的显示逻辑}

@end```

使用示例

```objcimport "JYTextView.h"

@interface ViewController : UIViewController@property (nonatomic, strong) JYTextView *textView;

@end@implementation ViewController- (void)viewDidLoad {

[super viewDidLoad];

self.textView = [[JYTextView alloc] initWithFrame:CGRectMake(0,100,375,200)];

self.textView.bubbleModels = @[].mutableCopy;

[self.view addSubview:self.textView];

}

@end```

总结

实现一个类似微信聊天页面的长按气泡弹窗功能非常简单，只需要几个步骤：将 `JYBubbleButtonModel`、`JYBubbleMenuView` 和 `JYTextView` 这三个类添加到您的工程中，然后将原来显示聊天内容的 `textView` 继承 `JYTextView` 即可。

聊天微信