使用三个20 TTButtonBar，iOS复制Facebook

Question

我希望复制Facebook在其应用中使用的按钮网格栏：

左按钮未按下，右按下。

我无法复制＆＃34;推送＆＃34;按钮状态。有人可以帮忙吗？这是我到目前为止所得到的：

我对其中的大部分都非常满意。只需刷新按钮的大小，但这是微不足道的。在我的工具栏上，左侧按钮应该被按下而右侧不是。很明显，我错过了Facebook在那里实施的那个投影。我怎么能复制这个？我正在考虑使用TTInnerShadowStyle，但似乎无法正确使用它。这是为每个按钮生成样式的代码：

UIColor *gradientFill1 = RGBCOLOR(249, 250, 252),*gradientFill2 = RGBCOLOR(225, 228, 235);

if (state != UIControlStateNormal) {
    gradientFill1 = RGBCOLOR(233, 234, 237);
    gradientFill2 = RGBCOLOR(214, 217, 223);
}

TTStyle *style= [TTShapeStyle styleWithShape:[TTRoundedRectangleShape shapeWithRadius:3] next:
        [TTInsetStyle styleWithInset:UIEdgeInsetsMake(1, 0, 1, 0) next:
         [TTLinearGradientBorderStyle styleWithColor1:RGBCOLOR(140, 144, 150)
                                               color2:RGBCOLOR(175, 179, 186) width:0.5 next:
         [TTLinearGradientBorderStyle styleWithColor1:RGBCOLOR(184, 186, 192)
                                               color2:RGBCOLOR(208, 212, 218) width:0.5 next:
            [TTLinearGradientFillStyle styleWithColor1:gradientFill1
                                              color2:gradientFill2 next:
             [TTShadowStyle styleWithColor:RGBACOLOR(253,254,254,1.0) blur:0
                                  offset:CGSizeMake(0, 1) next:
              [TTImageStyle styleWithImageURL:nil defaultImage:nil
                              contentMode:UIViewContentModeScaleToFill
                                       size:CGSizeZero next:
               [TTTextStyle styleWithFont:[UIFont boldSystemFontOfSize:12.0f]
                                color:RGBCOLOR(81, 91, 120)
                            shadowColor:nil
                         shadowOffset:CGSizeMake(0, 0) next:nil]]]]]]]];


return style;

非常感谢任何帮助。谢谢！

Answer 1

确实，在添加TTInnerShadowStyle时，您的代码会有点奇怪。但这似乎是由你的双边界风格引起的。

如果我在填充后插入内部阴影然后移动两个渐变边框隐藏内部阴影，它看起来完全符合预期。内部较浅的边框看起来错位。

我建议使用TTCatalog中“Chiseled”按钮和“内部阴影”示例的组合。它可能看起来像这样：

[TTShapeStyle styleWithShape:[TTRoundedRectangleShape shapeWithRadius:3] next:
[TTShadowStyle styleWithColor:RGBACOLOR(255,255,255,0.9) blur:1
                       offset:CGSizeMake(0, 1) next:
[TTLinearGradientFillStyle styleWithColor1:gradientFill1
                           color2:gradientFill2 next:
[TTInnerShadowStyle styleWithColor:RGBACOLOR(0,0,0,0.7) blur:7
                            offset:CGSizeMake(0, 0) next:
[TTSolidBorderStyle styleWithColor:black width:1 next:
[TTImageStyle styleWithImageURL:nil defaultImage:nil
                    contentMode:UIViewContentModeScaleToFill
                           size:CGSizeZero next:                      
[TTTextStyle styleWithFont:[UIFont boldSystemFontOfSize:12.0f]
                     color:RGBCOLOR(81, 91, 120)
               shadowColor:nil
              shadowOffset:CGSizeMake(0, 0) next:nil]]]]]]]

对于正常状态，只需将内阴影颜色设置为透明，或有条件地完全避免内部阴影。

Answer 2

你可以做的是直接进行并通过CoreGraphics实现你所追求的内部阴影效果。看看这个S.O. page。