(Rubymotion) Как я могу сделать это пользовательское представление в Formotion?

Сейчас я изо всех сил пытаюсь создать собственную форму с помощью Formotion(также я очень новичок в Rubymotion). Может быть, я должен попробовать другой фреймворк или, может быть, не делать какие-либо рамки вообще....

Я пытаюсь сделать это:

На данный момент я создал это в Formotion:

Проблема заключается в границе между паролем и электронной почтой. Он должен начинаться под текстовым полем, а не под значком. Это небольшое изменение, но я не знаю, как это сделать с помощью Formotion. Легко ли такие вещи? Заранее спасибо!

Вот мой код:

class LoginScreen < PM::FormotionScreen

  title ""

  def table_data
    {
      sections: [
        {
          title: "Login",
          rows: [
            {
              title:  "Email",
              key:    :email,
              type:   :email,
              placeholder: "me@mail.com",
              auto_correction: :no,
              auto_capitalization: :none,
              text_alignment: UITextAlignmentLeft
            }, {
              title: "Password",
              key: :password,
              type: :password,
              placeholder: "required",
              secure: true,
              text_alignment: UITextAlignmentLeft
            }
          ]
        }
      ]
    }
  end
end

Я переписал EmailRow, чтобы вставить значок

motion_require 'string_row'

module Formotion
  module RowType
    class EmailRow < StringRow

      def build_cell(cell)
        cell.selectionStyle = self.row.selection_style || UITableViewCellSelectionStyleBlue
        field = UITextField.alloc.initWithFrame(CGRectZero)
        field.tag = TEXT_FIELD_TAG

        observe(self.row, "value") do |old_value, new_value|
          break_with_semaphore do
            update_text_field(new_value)
          end
        end

        field.clearButtonMode = UITextFieldViewModeWhileEditing
        field.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter
        field.textAlignment = row.text_alignment || UITextAlignmentRight

        field.keyboardType = keyboardType

        field.secureTextEntry = true if row.secure?
        field.returnKeyType = row.return_key || UIReturnKeyNext
        field.autocapitalizationType = row.auto_capitalization if row.auto_capitalization
        field.autocorrectionType = row.auto_correction if row.auto_correction
        field.clearButtonMode = row.clear_button || UITextFieldViewModeWhileEditing
        field.enabled = row.editable?
        field.inputAccessoryView = input_accessory_view(row.input_accessory) if row.input_accessory

        add_callbacks(field)

        cell.swizzle(:layoutSubviews) do
          def layoutSubviews
            old_layoutSubviews

            # viewWithTag is terrible, but I think it's ok to use here...
            formotion_field = self.viewWithTag(TEXT_FIELD_TAG)
            formotion_field.sizeToFit

            field_frame = formotion_field.frame
            field_frame.origin.x = self.textLabel.frame.origin.x + Formotion::RowType::Base.field_buffer * 2
            field_frame.origin.y = ((self.frame.size.height - field_frame.size.height) / 2.0).round
            field_frame.size.width = self.frame.size.width - field_frame.origin.x - Formotion::RowType::Base.field_buffer
            formotion_field.frame = field_frame

          end
        end

        if UIDevice.currentDevice.systemVersion >= "6.0"
          field.swizzle(:setText) do
            def setText(text)
              r = old_setText(text)
              self.sendActionsForControlEvents(UIControlEventEditingChanged)
              r
            end
          end
        end

        field.font = BW::Font.new(row.font) if row.font
        field.placeholder = row.placeholder
        field.text = row_value

        icon = UIImage.imageNamed("icons/mail.png")
        icon_view = UIImageView.alloc.initWithImage(icon)
        icon_view.setFrame(CGRectMake(20, 18, icon_view.frame.size.width, icon_view.frame.size.height))

        cell.addSubview(icon_view)
        cell.addSubview(field)
        cell.textLabel.hidden = true
        field

      end

    end
  end
end

2 ответа

Решение

Это было чрезвычайно легко в конце. Просто добавьте изображение в cell.imageView в EmailRow.

добавил эту строку:

cell.imageView.image = UIImage.imageNamed("icons/mail.png")
cell.imageView.setFrame(CGRectMake(20, 18, cell.imageView.frame.size.width,       cell.imageView.frame.size.height))

и вы получаете доступ к ячейке с кодом ниже, например:

cell = @form.table.visibleCell.first

Я бы рекомендовал полностью отключить встроенную границу и добавить псевдо-границу, используя тонкий UIView, Таким образом, вы можете установить frame расположить его в правильном положении и дать ему цвет фона #E3E3E5k как в твоем макете.

Другие вопросы по тегам