ios - このエフェクトのやり方

Question

この効果を行う方法を知りたい:

ユーザーが最初の画面でプラス記号をクリックすると (最初のスクリーンショットを参照)、リストがドロップダウンし、プラス記号がマイナス記号に変わります (2 番目のスクリーンショットを参照)。

_{(ソース: store.qq.com )}

Answer 1

自分で書く必要があります。たとえば、これは非常に単純な例で、物を隠したり表示したりする方法を示しています。私はグラフィカルな +/- ボタンを使用していません (むしろ単純なテキスト ボタンです)。これは、テキスト パネルを表示するアニメーションを示しているだけです (このパネルにはグラフィックなどを配置できます)。

これを行う方法はたくさんありますが、これは単純化しすぎており、明らかに私は美学に時間を費やしていませんが、うまくいけば、使用できるいくつかのテクニックが示されます. 重要なトリックは、明らかにするものをメインビューの UIView に配置し、高さをゼロにしてから、フレームの変化をアニメートして展開することだと思います。ボタンを移動したり、ボタンに使用する UIImage を変更したりすることもできますが、アイデアは得られます。

//  SlideInViewController.m

#import "SlideInViewController.h"

@interface SlideInViewController ()
{
    UIView *_hiddenPanel;
    UIButton *_hideShowButton;
    BOOL _panelHidden;
}
@end

@implementation SlideInViewController

- (void)viewDidLoad
{
    [super viewDidLoad];

    // initialize the flag

    _panelHidden = YES;

    // create the panel that will be hidden initially (height of zero), but will be revealed when you click on the button

    _hiddenPanel = [[UIView alloc] initWithFrame:CGRectMake(0.0, 300.0, self.view.frame.size.width, 0.0)];
    _hiddenPanel.clipsToBounds = YES;
    [self.view addSubview:_hiddenPanel];

    // add the button

    _hideShowButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    _hideShowButton.frame = CGRectMake(40.0, 260.0, 40.0, 40.0);
    [_hideShowButton setTitle:@"+" forState:UIControlStateNormal];
    [_hideShowButton addTarget:self action:@selector(hideShowPanel:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:_hideShowButton];

    // now put whatever you want on this hidden panel.

    UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0.0, 0.0, self.view.frame.size.width, 200.0)];
    label.lineBreakMode = UILineBreakModeWordWrap;
    label.numberOfLines = 0;
    label.text = @"This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. This is a very long label. ";
    [_hiddenPanel addSubview:label];

    // Do any additional setup after loading the view.
}

- (IBAction)hideShowPanel:(id)sender
{
    if (_panelHidden)
    {
        // if the panel was already hidden, let's reveal it (and move/adjust the button accordingly)

        [UIView animateWithDuration:1.0 animations:^{
            _hideShowButton.frame = CGRectMake(40.0, 60.0, 40.0, 40.0);
            [_hideShowButton setTitle:@"-" forState:UIControlStateNormal];

            _hiddenPanel.frame = CGRectMake(0.0, 100.0, self.view.frame.size.width, 200.0);
        }];
    }
    else
    {
        // if the panel was already shown, so now let's hide it again (and move/adjust the button accordingly)
        [UIView animateWithDuration:1.0 animations:^{
            _hideShowButton.frame = CGRectMake(40.0, 260.0, 40.0, 40.0);
            [_hideShowButton setTitle:@"+" forState:UIControlStateNormal];

            _hiddenPanel.frame = CGRectMake(0.0, 300.0, self.view.frame.size.width, 0.0);
        }];
    }

    _panelHidden = !_panelHidden;
}

@end