Flutter-将屏幕焦点放在某个小部件上

时间:2020-02-26 13:51:09

标签: flutter dart

我需要执行以下操作:当我按列表1时,屏幕聚焦在列表1上。其余选项我都需要

这是示例的代码: code

此行为已存在于网页中,但在移动应用程序级别上我还没有发现相同的行为。谢谢

2 个答案:

答案 0 :(得分:2)

这是一个类似类似内容的小代码段,可以帮助您获得所需的结果。

通过单击fab图标,它将向下滚动到ListView中的项目35。

class MyHomePage extends StatelessWidget {
  final _scrollController = ScrollController();
  final _cardHeight = 200.0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      floatingActionButton: FloatingActionButton(
        backgroundColor: Colors.orange,
        onPressed: () => _animateToIndex(35),
        child: Icon(Icons.add),
      ),
      body: ListView.builder(
        controller: _scrollController,
        itemCount: 100,
        itemBuilder: (_, i) => Container(
          height: _cardHeight,
          child: Card(
            color: Colors.lightBlue,
            child: Center(
              child: Text("Scroll Item $i", style: TextStyle(fontSize: 28.0),),
            ),
          ),
        ),
      ),
    );
  }

  _animateToIndex(index) {
    _scrollController.animateTo(_cardHeight * index,
        duration: Duration(seconds: 1), curve: Curves.fastOutSlowIn);
  }
}

答案 1 :(得分:1)

您需要具有可滚动的public class MainActivity extends AppCompatActivity { final Context context = this; private ArrayList<String> itemslistArray = new ArrayList<String>(); private EditText newItemTextField; private ArrayAdapter simpleAdapter; private FloatingActionButton fab; @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP) @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // ------------------------------- TOOLBAR ------------------------------------------------- Toolbar myToolbar = (Toolbar) findViewById(R.id.my_toolbar); setSupportActionBar(myToolbar); // ------------------------------- DRAWER -------------------------------------------------- DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout); ActionBarDrawerToggle toggle = new ActionBarDrawerToggle( this, drawer, myToolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close); drawer.addDrawerListener(toggle); toggle.syncState(); // ------------------------------------- FLOATING BUTTON ----------------------------------------------------------- fab = (FloatingActionButton) findViewById(R.id.fab); fab.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { AlertDialog.Builder builder = new AlertDialog.Builder(context); builder.setTitle("Add item"); // Set up the input final EditText input = new EditText(context); // Specify the type of input expected; this, for example, sets the input as a password, and will mask the text input.setInputType(InputType.TYPE_CLASS_TEXT); builder.setView(input); // Set up the buttons builder.setPositiveButton("Save", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { itemslistArray.add(input.getText().toString()); simpleAdapter.notifyDataSetChanged(); } }); builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { dialog.cancel(); } }); builder.show(); } }); // ------------------------------------- SIMPLE LIST ----------------------------------------------------------- itemslistArray.add("Item1"); itemslistArray.add("Item2"); itemslistArray.add("Item3"); itemslistArray.add("Item4"); itemslistArray.add("Item5"); simpleAdapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, itemslistArray); final ListView simpleListView = (ListView) findViewById(R.id.listSimple); simpleListView.setAdapter(simpleAdapter); // ----------------------------- LISTENNER TO MODIFY --------------------------------------------------- simpleListView.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> arg0, View arg1, int position, long arg3) { final int obj_position = position; Object o = simpleListView.getItemAtPosition(position); AlertDialog.Builder builder = new AlertDialog.Builder(context); builder.setTitle("Modify item"); // Set up the input final EditText input = new EditText(context); // Specify the type of input expected; this, for example, sets the input as a password, and will mask the text input.setInputType(InputType.TYPE_CLASS_TEXT); input.setText(o.toString()); builder.setView(input); // Set up the buttons builder.setPositiveButton("Save", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { itemslistArray.set(obj_position, input.getText().toString()); simpleAdapter.notifyDataSetChanged(); } }); builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { dialog.cancel(); } }); builder.show(); } }); // ------------------------------------- CUSTOM LIST ----------------------------------------------------------- ArrayList<AndroidVersion> androidList = new ArrayList<AndroidVersion>(); initList(androidList); AndroidAdapter adapter = new AndroidAdapter(this, R.layout.android_version_layout, androidList); final ListView list = (ListView) findViewById(R.id.customListView); list.setAdapter(adapter); list.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapter, View v, int position, long id) { AndroidVersion selectedItem = (AndroidVersion) adapter.getItemAtPosition(position); Log.v("CustomAdapterExemple", "Selected element: " + selectedItem.getVersionName()); } }); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu, menu); return true; } ... (例如WidgetListView),而不是SingleScrollableWidget中的Column

然后在其中添加一个ListSecondPageScrollController应该会收到被点击的按钮。根据该选择,您可以使用ListSecondPage

滚动到所需的位置