你如何在屏幕上显示它下面的 UISlider 的值，如图所示？

Question

我是 ios 的新手 development.I 必须设计这个 screen.I 已经使用图像显示滑块下方的数字，但它看起来不太好 screen.Please 告诉我的其他方法 it.And 请告诉我，如果我想在使用自动版式时绘制这些数字，我该如何设置坐标。谢谢

Answer 1

如果您想以编程方式执行此操作，请查看 Vvk Aghera 的 . If you want to do it 'visually' with interface builder, the easiest way to accomplish that is by using stack views。

1。设置视图

在 Interface Builder 中，您为每个数字添加一个滑块元素和一个标签（总共 11 个）。

将标签放在水平堆栈视图中，并在属性检查器中将分布设置为“均匀填充”：

您还可以通过选择所有标签并打开属性检查器来轻松配置文本颜色和居中对齐标签：

将水平堆栈视图和滑块放在垂直堆栈视图中，给你这样的东西：

您的视图层次结构应如下所示：

堆栈视图（垂直）
- 滑块
- 堆栈视图（水平）
  - 标签
  - 标签
  - ...

截图：

2。配置滑块

然后您可以configure the slider使用属性检查器。例如，您可以在那里将最大值设置为 100:

如果您在将滑块连接到控制器并访问其值方面需要帮助，请查看这些教程：

iOS创作者的UISLider tutorial
雷文德利希的A Simple iOS App

别忘了UISlider class reference。

Answer 2

使用 UICollectionView 使用你的 ViewController 就像...... 首先制作一个 UICollectionView Cell，我们正在使用 Prototype Cell。

@property (strong, nonatomic)IBOutlet UICollectionView *clnView;
@property (strong, nonatomic)IBOutlet UISlider *slider;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    [self.clnView reloadData];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

#pragma mark - Slider Action

-(IBAction)sliderAction:(id)sender
{
    UISlider *slider = (UISlider*)sender;
    float value = slider.value;
    NSLog(@"value::::%f",value);
}

#pragma mark - Collection View Delegate Methods

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return 11;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    CellNumber *aCell = [collectionView dequeueReusableCellWithReuseIdentifier:@"CellNumber" forIndexPath:indexPath];
    aCell.lblNo.text = [NSString stringWithFormat:@"%ld",(long)indexPath.row*10];
    return aCell;
}

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    return CGSizeMake(self.clnView.frame.size.width/15, self.clnView.frame.size.height);
}

CellNumber 是您的自定义 CollectionViewcell。见下文...

CellNumber.h

#import <UIKit/UIKit.h>

@interface CellNumber : UICollectionViewCell

@property (strong, nonatomic)IBOutlet UILabel *lblNo;

@end

单元格的 .m 文件中没有任何内容。比去故事板制作原型单元并提供所有奥特莱斯。在 故事板 上：

1) 添加collection 水平视图

2) 添加小区标识符和class.

3) 在 cell 中添加 UILable 并设置 outlet

4) 添加滑块并设置 Outlet，而不是设置 ValuChange Action。

查看下面的所有图片....

输出

你如何在屏幕上显示它下面的 UISlider 的值，如图所示？

How can you show values of UISlider below it on screen like shown in the picture?

ios

uislider

1。设置视图

2。配置滑块