web-dev-qa-db-ja.com

UITableViewCell、スワイプで削除ボタンを表示

UITableViewCellをスワイプすると削除ボタンが表示されるようにするにはどうすればいいですか？イベントは発生せず、削除ボタンは表示されません。

iosobjective-cuitableviewcocoa-touchuikit
547
TheLearner

(-viewDidLoad or in storyboard)で起動中に以下の操作を行います。

self.tableView.allowsMultipleSelectionDuringEditing = NO;

Table Viewの条件付き編集をサポートするためにオーバーライドします。これはいくつかの項目に対してNOを返そうとしている場合にのみ実装する必要があります。デフォルトでは、すべての項目が編集可能です。

- (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath {
    // Return YES if you want the specified item to be editable.
    return YES;
}

// Override to support editing the table view.
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
    if (editingStyle == UITableViewCellEditingStyleDelete) {
        //add code here for when you hit delete
    }    
}
1016
Kurbz

この回答はSwift 3に更新されました

私が新しいタスクを学んでいるときになにも想定されないように、非常に単純な自己完結型の例を持つのはいいことだと常に思います。この回答は、UITableView行を削除するためのものです。プロジェクトは次のように実行されます。

enter image description here

このプロジェクトはSwiftの UITableViewの例に基づいています 。

コードを追加する

新しいプロジェクトを作成し、ViewController.Swiftコードを次のコードに置き換えます。

import UIKit
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    // These strings will be the data for the table view cells
    var animals: [String] = ["Horse", "Cow", "Camel", "Pig", "Sheep", "Goat"]

    let cellReuseIdentifier = "cell"

    @IBOutlet var tableView: UITableView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // It is possible to do the following three things in the Interface Builder
        // rather than in code if you prefer.
        self.tableView.register(UITableViewCell.self, forCellReuseIdentifier: cellReuseIdentifier)
        tableView.delegate = self
        tableView.dataSource = self
    }

    // number of rows in table view
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.animals.count
    }

    // create a cell for each table view row
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cell:UITableViewCell = self.tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as UITableViewCell!

        cell.textLabel?.text = self.animals[indexPath.row]

        return cell
    }

    // method to run when table view cell is tapped
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        print("You tapped cell number \(indexPath.row).")
    }

    // this method handles row deletion
    func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {

        if editingStyle == .delete {

            // remove the item from the data model
            animals.remove(at: indexPath.row)

            // delete the table view row
            tableView.deleteRows(at: [indexPath], with: .fade)

        } else if editingStyle == .insert {
            // Not used in our example, but if you were adding a new row, this is where you would do it.
        }
    }

}

行の削除を可能にする上記のコードの単一キーメソッドは最後のものです。ここでもまた強調しておきます。

// this method handles row deletion
func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {

    if editingStyle == .delete {

        // remove the item from the data model
        animals.remove(at: indexPath.row)

        // delete the table view row
        tableView.deleteRows(at: [indexPath], with: .fade)

    } else if editingStyle == .insert {
        // Not used in our example, but if you were adding a new row, this is where you would do it.
    }
}

絵コンテ

ストーリーボードのView ControllerにUITableViewを追加します。自動レイアウトを使用して、Table Viewの四辺をView Controllerの端に固定します。ストーリーボードのテーブルビューからコードの@IBOutlet var tableView: UITableView!行へのドラッグを制御します。

終了しました

それで全部です。今すぐアプリを実行し、左にスワイプして[Delete]をタップして行を削除できます。

変奏曲

[削除]ボタンのテキストを変更します

enter image description here

以下のメソッドを追加してください。

func tableView(_ tableView: UITableView, titleForDeleteConfirmationButtonForRowAt indexPath: IndexPath) -> String? {
    return "Erase"
}

カスタムボタンの動作

enter image description here

以下の方法を追加してください。

func tableView(_ tableView: UITableView, editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? {

    // action one
    let editAction = UITableViewRowAction(style: .default, title: "Edit", handler: { (action, indexPath) in
        print("Edit tapped")
    })
    editAction.backgroundColor = UIColor.blue

    // action two
    let deleteAction = UITableViewRowAction(style: .default, title: "Delete", handler: { (action, indexPath) in
        print("Delete tapped")
    })
    deleteAction.backgroundColor = UIColor.red

    return [editAction, deleteAction]
}

これはiOS 8からしか利用できないことに注意してください。詳細は この答え を参照してください。

iOS 11用に更新

IOS 11のUITableViewDelegate APIに追加されたメソッドを使用して、アクションをセルの先頭または末尾に配置できます。

func tableView(_ tableView: UITableView,
                leadingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration?
 {
     let editAction = UIContextualAction(style: .normal, title:  "Edit", handler: { (ac:UIContextualAction, view:UIView, success:(Bool) -> Void) in
             success(true)
         })
editAction.backgroundColor = .blue

         return UISwipeActionsConfiguration(actions: [editAction])
 }

 func tableView(_ tableView: UITableView,
                trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration?
 {
     let deleteAction = UIContextualAction(style: .normal, title:  "Delete", handler: { (ac:UIContextualAction, view:UIView, success:(Bool) -> Void) in
         success(true)
     })
     deleteAction.backgroundColor = .red

     return UISwipeActionsConfiguration(actions: [deleteAction])
 }

参考文献

97
Suragch

このコードは、削除を実装する方法を示しています。

#pragma mark - UITableViewDataSource

// Swipe to delete.
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath
{
    if (editingStyle == UITableViewCellEditingStyleDelete) {
        [_chats removeObjectAtIndex:indexPath.row];
        [tableView deleteRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationAutomatic];
    }
}

必要に応じて、初期化オーバーライドで、編集ボタン項目を表示するために以下の行を追加します。

self.navigationItem.leftBarButtonItem = self.editButtonItem;
68
ma11hew28

注：Kurbzからの回答にコメントを投稿するのに十分な評判がありません。

クルズからの答えは正しいです。しかし、私にとってはうまくいきませんでした。

調査の結果、Table Viewを編集していない場合は スワイプ - トゥ - 削除が行われることがわかりました。 。

私はこれがそのように明白に述べられているのを見たことがありません。誤解しない限り、私はそれを機能させる他の方法を見つけていません。

編集中は、削除コントロールや並べ替えコントロールが表示されます。

34
GenesisST

私はそれが誰かに役立つかもしれないので私はそれを共有しているので、私はちょうど解決することができた問題を抱えていた。

私はUITableViewを持っていて、スワイプを削除することを可能にするために示された方法を加えました：

- (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath {
    // Return YES if you want the specified item to be editable.
    return YES;
}

// Override to support editing the table view.
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
    if (editingStyle == UITableViewCellEditingStyleDelete) {
        //add code here for when you hit delete
    }    
}

テーブルを編集モードにして複数選択を有効にできるようにするための更新プログラムに取り組んでいます。そのために、私はAppleの TableMultiSelect sampleからコードを追加しました。その作業が完了したら、スワイプ削除機能が機能しなくなったことがわかりました。

ViewDidLoadに次の行を追加することが問題であることがわかりました。

self.tableView.allowsMultipleSelectionDuringEditing = YES;

この行を入力すると、複数選択は機能しますが、削除するスワイプは機能しません。線がなければそれは逆であった。

修正：

ViewControllerに次のメソッドを追加します。

- (void)setEditing:(BOOL)editing animated:(BOOL)animated
{
    self.tableView.allowsMultipleSelectionDuringEditing = editing; 
    [super setEditing:editing animated:animated];
}

それからテーブルを編集モードにするあなたのメソッド（例えばボタンを押すことから）であなたは使うべきです：

[self setEditing:YES animated:YES];

の代わりに：

[self.tableView setEditing:YES animated:YES];

これは、テーブルが編集モードの場合にのみ複数選択が有効になることを意味します。

24
Leon

以下のUITableViewDataSourceはスワイプ削除に役立ちます 

- (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath {
    // Return YES if you want the specified item to be editable.
    return YES;
}

- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
    if (editingStyle == UITableViewCellEditingStyleDelete) {
        [arrYears removeObjectAtIndex:indexPath.row];
        [tableView reloadData];
    }
}

arrYears はNSMutableArrayであり、その後tableViewをリロードします

スイフト 

 func tableView(tableView: UITableView, canEditRowAtIndexPath indexPath: NSIndexPath) -> Bool {
            return true
        }

func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {
    if editingStyle == UITableViewCellEditingStyleDelete {
        arrYears.removeObjectAtIndex(indexPath.row)
        tableView.reloadData()
    }
}
18
iAnkit

IOS 8とSwift 2.0ではこれを試してください。

override func tableView(tableView: UITableView, canEditRowAtIndexPath indexPath: NSIndexPath) -> Bool {
   // let the controller to know that able to edit tableView's row 
   return true
}

override func tableView(tableView: UITableView, commitEdittingStyle editingStyle UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath)  {
   // if you want to apply with iOS 8 or earlier version you must add this function too. (just left in blank code)
}

override func tableView(tableView: UITableView, editActionsForRowAtIndexPath indexPath: NSIndexPath) -> [UITableViewRowAction]?  {
   // add the action button you want to show when swiping on tableView's cell , in this case add the delete button.
   let deleteAction = UITableViewRowAction(style: .Default, title: "Delete", handler: { (action , indexPath) -> Void in

   // Your delete code here.....
   .........
   .........
   })

   // You can set its properties like normal button
   deleteAction.backgroundColor = UIColor.redColor()

   return [deleteAction]
}
17
Masa S-AiYa

@ Kurbzの答えは素晴らしいですが、私はこのメモを残してこの答えが人々の時間を節約できることを願っています。

私は時々私のコントローラーにこれらのラインを入れました、そして、それらはスワイプ機能を働かせなくしました。

- (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath{
    return UITableViewCellEditingStyleNone; 
}

編集スタイルとしてUITableViewCellEditingStyleInsertまたはUITableViewCellEditingStyleNoneを使用すると、スワイプ機能は機能しません。デフォルトのスタイルであるUITableViewCellEditingStyleDeleteのみを使用できます。

10
Brian

スイフト3

あなたがしなければならないのはこれら二つの機能を可能にすることだけです：

func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool {

    return true

}

func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {

    if editingStyle == UITableViewCellEditingStyle.delete {
        tableView.reloadData()
    }

}
8
Machado

スイフト4 

func tableView(_ tableView: UITableView, editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? {
    let delete = UITableViewRowAction(style: .destructive, title: "delete") { (action, indexPath) in
        // delete item at indexPath
    tableView.deleteRows(at: [indexPath], with: .fade)

    }
    return [delete]
}
8
Pratik Lad

また、これはSwiftで次のような方法で実現できます。

func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {
    if (editingStyle == UITableViewCellEditingStyle.Delete){
        testArray.removeAtIndex(indexPath.row)
        goalsTableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: UITableViewRowAnimation.Automatic)
    }
}
8
DrPatience

私は古い質問ですが、@ Kurbzの回答はXcode 6.3.2とSDK 8.3に必要です。

私は[tableView beginUpdates]と[tableView endUpdates]を追加する必要があります（@ bay.phillips ここ のおかげで）

// Override to support editing the table view.
- (void)tableView:(UITableView *)tableView commitEditingStyle: (UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
    // Open "Transaction"
    [tableView beginUpdates];

    if (editingStyle == UITableViewCellEditingStyleDelete) {
        // your code goes here
        //add code here for when you hit delete
        [tableView deleteRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationFade];
     }

    // Close "Transaction"
    [tableView endUpdates];
}
7
Beto
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath 
{
    if (editingStyle == UITableViewCellEditingStyleDelete)
    {
        //add code here for when you hit delete
        [dataSourceArray removeObjectAtIndex:indexPath.row];
        [tableView deleteRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationAutomatic];
    }    
}
6
Rahul K Rajan

テーブルビューのセルを削除するときは、インデックスxの配列オブジェクトも削除する必要があります。

スワイプジェスチャーを使って削除できると思います。テーブルビューはデリゲートを呼び出します。

- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
    if (editingStyle == UITableViewCellEditingStyleDelete) {
        //add code here for when you hit delete
        [dataSourceArray removeObjectAtIndex:indexPath.row];
    }    
}

オブジェクトを削除した後あなたはテーブルビューの使用をリロードする必要があります。コードに次の行を追加してください。

[tableView reloadData];

その後、行は正常に削除されました。また、ビューを再ロードしたり、データをDataSourceに追加したりすると、オブジェクトは存在しなくなります。

他のすべてのために正しいKurbzからの答えです。

DataSource配列からオブジェクトを削除したいのであれば、デリゲート関数では不十分であることを思い出してほしいだけでした。

私はあなたを助けてくれたと思います。

6
Robybyte

Swiftでは、このコードを書くだけ

func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {
        if editingStyle == .Delete {
            print("Delete Hit")
        }
}

Objective Cでは、このコードを書くだけです。

- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
       if (editingStyle == UITableViewCellEditingStyleDelete) {           
            NSLog(@"index: %@",indexPath.row);
           }
}
2
Kiran Jasvanee

Swift 2.2：

override func tableView(tableView: UITableView, canEditRowAtIndexPath indexPath: NSIndexPath) -> Bool {
    return true
}

override func tableView(tableView: UITableView,
    editActionsForRowAtIndexPath indexPath: NSIndexPath) -> [UITableViewRowAction]? {
    let delete = UITableViewRowAction(style: UITableViewRowActionStyle.Default, title: "DELETE"){(UITableViewRowAction,NSIndexPath) -> Void in

    print("Your action when user pressed delete")
}
let edit = UITableViewRowAction(style: UITableViewRowActionStyle.Normal, title: "EDIT"){(UITableViewRowAction,NSIndexPath) -> Void in

    print("Your action when user pressed edit")
}
    return [delete, block]
}
2
lcl

swift4コードの場合は、最初に編集を有効にします。

func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool {
    return true
}

次に、編集デリゲートに削除アクションを追加します。

func tableView(_ tableView: UITableView, editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? {
    let action = UITableViewRowAction(style: .destructive, title: "Delete") { (_, index) in
        // delete model object at the index
        self.models[index.row]
        // then delete the cell
        tableView.beginUpdates()
        tableView.deleteRows(at: [index], with: .automatic)
        tableView.endUpdates()

    }
    return [action]
}
2
Abdoelrhman