Question

我现在正在努力用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

Answer 1

这最终非常容易。只需在EmailRow中的cell.imageView中添加图片。

添加了这一行：

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

Answer 2

我建议完全禁用内置边框，并使用精简UIView添加伪边框。这样你就可以设置frame将它放在正确的位置，并像你的模型一样给它一个#E3E3E5k的backgroundColor。

（Rubymotion）如何在Formotion中执行此自定义视图？

2 个答案: