WMPageController选项卡自定义图片

项目需求如下图：

• 修改选项卡为自定义图片
• 加粗选中的字体
• 

  WMPageController.gif

查看 WMPageController (版本2.5.2)源代码，感谢作者开源，验证其最后都在WMProgressView.m中的- (void)drawRect:(CGRect)rect进行重绘。

故仿照其重绘过程，增加自定义绘制在WMProgressView.h中

...
@property (nonatomic, assign) BOOL hollow;
@property (nonatomic, assign) BOOL hasBorder;
@property (nonatomic, assign) BOOL strokeImage; //增加填充图片Bool值，根据此值来进行绘制

- (void)setProgressWithOutAnimate:(CGFloat)progress;

在WMProgressView.m中的drawRect:方法中增加绘制方式，同时导入图片资源。

    if (self.strokeImage) {
        UIImage *image = [UIImage imageNamed:@"jy_healthInfo_ic_titleBG"];
        //翻转镜像
        CGContextTranslateCTM(ctx, 0, height);
        CGContextScaleCTM(ctx, 1.0, -1.0);
        //画图
        CGContextDrawImage(ctx, CGRectMake(startX+10, lineWidth / 2.0, width-20, height - lineWidth), image.CGImage);
        return;
    }

跟踪其hollow、hasBorder查看赋值的地方，发现在addProgressViewWithFrame:::::中
所以更新这个方法

- (void)addProgressViewWithFrame:(CGRect)frame isTriangle:(BOOL)isTriangle hasBorder:(BOOL)hasBorder hollow:(BOOL)isHollow strokeImage:(BOOL)strokeImage cornerRadius:(CGFloat)cornerRadius {
    WMProgressView *pView = [[WMProgressView alloc] initWithFrame:frame];
    pView.itemFrames = [self convertProgressWidthsToFrames];
    pView.color = self.lineColor.CGColor;
    pView.isTriangle = isTriangle;
    pView.hasBorder = hasBorder;
    pView.hollow = isHollow;
    pView.cornerRadius = cornerRadius;
    pView.naughty = self.progressViewIsNaughty;
    pView.speedFactor = self.speedFactor;
    pView.backgroundColor = [UIColor clearColor];
    pView.strokeImage = strokeImage;
    self.progressView = pView;
    [self.scrollView insertSubview:self.progressView atIndex:0];
}

添加stokeImage，并修改报错

    [self addProgressViewWithFrame:frame
                        isTriangle:(self.style == WMMenuViewStyleTriangle)
                         hasBorder:(self.style == WMMenuViewStyleSegmented)
                            hollow:(self.style == WMMenuViewStyleFloodHollow)
                       strokeImage:(self.style == WMMenuViewStyleStrokeImage)
                      cornerRadius:self.progressViewCornerRadius];

在WMMenuView.h中，增加枚举值

typedef NS_ENUM(NSUInteger, WMMenuViewStyle) {
    ...
    WMMenuViewStyleSegmented,    // 涌入带边框,即网易新闻选项卡
    WMMenuViewStyleStrokeImage,  // 添加自定义图片
};

在初始化WMPageController控制器的时候，将menuViewStyle属性赋值为新增的枚举值self.pageController.menuViewStyle = WMMenuViewStyleStrokeImage;

测试已经可以显示图片了。

最后，找到字体赋值的地方，修改粗体

        if (self.fontName) {
            item.font = [UIFont fontWithName:self.fontName size:item.selectedSize];
        } else {
            //item.font = [UIFont systemFontOfSize:item.selectedSize];
            item.font = [UIFont fontWithName:@"Helvetica-Bold" size:item.selectedSize]; //选中变成粗体
        }

完成，顺道再贴个Demo地址