web-dev-qa-db-ja.com

トグルボタンとしてUIButtonを使用する方法

テーブルの各セルにトグルボタンを作成しようとしています。押すと画像が変わり、もう一度押すと画​​像が再び変わります-トグル。

UIButtonクラスにはselected状態はありません。

クリックするたびに状態を変更できるように、UIButtonでトグルボタンを作成する方法を探しています。

これがrubymotionで現在rmqを使用して実行している方法です

@fav_button.on(:touch) do |sender|
  puts "pressed fav button for id: " + data[:id] + " and name: " + data[:name]
  #how do I change the state here?
end
21
Anthony

トグルボタンを簡単に作成できます。それぞれの状態にそれぞれの画像を設定する必要があります。その後、selectedプロパティを使用して、これらの画像を切り替えることができます。

その方法を示すために純粋なObjective-Cコードを作成しましたが、Storyboards ou Xibsでも画像を設定できます。確認してください。

// First, set the images for normal state and selected state
[button setImage:normalImage forState:UIControlStateNormal];
[button setImage:selectedImage forState:UIControlStateSelected];


// Don't forget to add an action handler to toggle the selected property
[button addTarget:self action:@selector(buttonTouch:withEvent:) forControlEvents:UIControlEventTouchUpInside];


// Now, in your button action handler, you can do something like this:
- (void)buttonTouch:(UIButton *)aButton withEvent:(UIEvent *)event
{
  aButton.selected = !aButton.selected;
}

これがお役に立てば幸いです。

40
Jan Cássio

Swift 4.0ソリューション(ストーリーボードを使用)

まず、属性インスペクターでUIButton TypeがCustomに設定されていることを確認します。

Ensure UIButton Type is set to Custom

// Reference to UIButton in Storyboard
@IBOutlet weak var toggleButton: UIButton!

override func viewDidLoad() {
    super.viewDidLoad()

    // assumes you have two images in the bundle/project 
    // called normal.png and selected.png.
    let normalImage = UIImage(named: "normal.png")
    let selectedImage = UIImage(named: "selected.png")

    toggleButton.setImage(normalImage, for: .normal)
    toggleButton.setImage(selectedImage, for: .selected)
}

以下のスクリーンショットは、ストーリーボードでのtoggleButtonへの参照と、Touch Up Insideイベント、つまりユーザーがボタンをタップすると、以下のdidPressButtonが発生します。

enter image description here

@IBAction func didPressButton(_ sender: Any) {

    // if the button was selected, then deselect it.
    // otherwise if it was not selected, then select it.
    toggleButton.isSelected = !trackingButton.isSelected

    if toggleButton.isSelected {
        print("I am selected.")

    } else {
        print("I am not selected.")
    }
}
4
JaredH

あなたの質問はrmqについて言及していたので、これを行うrmqの方法を次に示します。

viewDidLoad内:

@hello_world_label = rmq.append(UILabel, :hello_world).get
@button            = rmq.append(UIButton, :toggleable_button)

@button.on(:touch) do |sender|
  sender.selected = !sender.selected?
end

トグルはボタンの実際の状態を照会することによって実現されることに注意してください。これを後で使用するために覚えておく必要がある場合は、インスタンス変数に保存することをお勧めします。

スタイルシートで:

def toggleable_button(st)
  st.frame = {t: 200, w: 100, h: 24}
  st.image_normal = image.resource('toggle_me')
  st.image_selected = image.resource('toggled')
end

image_selectedの使用に注意してください。まあ、これはrmqには存在しませんが、非常に簡単に発生させることができます。これがrmqプロジェクトの場合、stylers /ディレクトリが作成されます。そこに、ui_button_styler.rbが表示されます。以下は、強調表示された状態を一流の市民にするコードです。

module RubyMotionQuery
  module Stylers
    class UIButtonStyler < UIControlStyler 

      def image_selected=(value)
        @view.setImage(value, forState:UIControlStateSelected)
      end
      def image_selected
        @view.imageForState UIControlStateSelected
      end

    end
  end
end

ご覧のとおり、コントローラーコードはクリーンなままで、ボタンの初期設定はスタイルシートに移されており、選択した状態を理解するためにrmqをきちんと拡張しています。

1
Steve Ross

あなたは非常に簡単なアプローチでそれを行うことができます。まず、ボタンのviewDidLoadセットタグで。まあ言ってみれば self.toggleButton.tag = 111。ボタンアクション関数で、次のようにボタンを切り替えることができます。

- (IBAction)toggling:(id)sender{
    if(self.toggleButton.tag == 111){
        //this is normal state
        [self.toggleButton setTitle:@"Less..." forState:UIControlStateNormal];
        self.toggleButton.tag = 222;
    }else{
        //selected state
        [self.toggleButton setTitle:@"More..." forState:UIControlStateNormal];
        self.toggleButton.tag = 111;
    }
}

このようにボタンの画像を変更できます[self.toggleButton setImage://some image forState:UIControlStateNormal];。それは私が考える最も簡単な方法です。お役に立てば幸いです。

0
Julfikar

ボタンの画像を切り替えるための私の最も簡単なロジック。 :)

(IBAction)toggleButton:(id)sender {
       if (self.toggleButton.selected==YES) {
           [self.toggleButton setSelected:NO];
        }else{
       [self.toggleButton setSelected:YES];
       [self.toggleButton setImage:[UIImage imageNamed:@"favStar.png"]    forState:UIControlStateSelected];
       }
0
Hic Up